mirror_html/html5-test-page
1
0
Fork 0
mirror of https://github.com/cbracco/html5-test-page.git synced 2025-08-07 14:46:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #36 from cbracco/97arushisharma-horizontal-list

Browse Source 
Add background images example
This commit is contained in:
Chris Bracco
2021-04-03 15:08:36 -04:00
committed by GitHub
parent a7b56dec9b 7611bf513b
commit a65554bba1
3 changed files with 19 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@@ -1,4 +1,8 @@
# 0.9.0 (March 19, 2018) # 0.9.1 (April 3, 2021)
- Add background images (thanks @97arushisharma!).
# 0.9.0 (April 3, 2021)
- Add <details>, <address>, <object>, <embed>, <datalist> (thanks @jKratzik!). - Add <details>, <address>, <object>, <embed>, <datalist> (thanks @jKratzik!).

19
index.html
View File

@@ -1,4 +1,4 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@@ -32,7 +32,9 @@
<li> <li>
<a href="#embedded">Embedded content</a> <a href="#embedded">Embedded content</a>
<ul> <ul>
<li><a href="#embedded__images">Images</a></li> <li><a href="#embedded__images">Images</a></li>
<li><a href="#embedded__bgimages">Background images</a></li>
<li><a href="#embedded__audio">Audio</a></li> <li><a href="#embedded__audio">Audio</a></li>
<li><a href="#embedded__video">Video</a></li> <li><a href="#embedded__video">Video</a></li>
<li><a href="#embedded__canvas">Canvas</a></li> <li><a href="#embedded__canvas">Canvas</a></li>
@@ -256,17 +258,22 @@
<header><h2>Images</h2></header> <header><h2>Images</h2></header>
<div> <div>
<h3>No <code>&lt;figure&gt;</code> element</h3> <h3>No <code>&lt;figure&gt;</code> element</h3>
<p><img src="http://placekitten.com/480/480" alt="Image alt text"></p> <p><img src="https://placekitten.com/480/480" alt="Image alt text"></p>
<h3>Wrapped in a <code>&lt;figure&gt;</code> element, no <code>&lt;figcaption&gt;</code></h3> <h3>Wrapped in a <code>&lt;figure&gt;</code> element, no <code>&lt;figcaption&gt;</code></h3>
<figure><img src="http://placekitten.com/420/420" alt="Image alt text"></figure> <figure><img src="https://placekitten.com/420/420" alt="Image alt text"></figure>
<h3>Wrapped in a <code>&lt;figure&gt;</code> element, with a <code>&lt;figcaption&gt;</code></h3> <h3>Wrapped in a <code>&lt;figure&gt;</code> element, with a <code>&lt;figcaption&gt;</code></h3>
<figure> <figure>
<img src="http://placekitten.com/420/420" alt="Image alt text"> <img src="https://placekitten.com/420/420" alt="Image alt text">
<figcaption>Here is a caption for this image.</figcaption> <figcaption>Here is a caption for this image.</figcaption>
</figure> </figure>
</div> </div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="embedded__bgimages">
<header><h2>Background images</h2></header>
<div style="background-image:url('https://placekitten.com/300/300'); width:300px; height: 300px;"></div>
<footer><p><a href="#top">[Top]</a></p></footer>
</article>
<article id="embedded__audio"> <article id="embedded__audio">
<header><h2>Audio</h2></header> <header><h2>Audio</h2></header>
<div><audio controls="">audio</audio></div> <div><audio controls="">audio</audio></div>
@@ -328,7 +335,7 @@
</p> </p>
<p> <p>
<label for="input__webaddress">Web Address</label> <label for="input__webaddress">Web Address</label>
<input id="input__webaddress" type="url" placeholder="http://yoursite.com"> <input id="input__webaddress" type="url" placeholder="https://yoursite.com">
</p> </p>
<p> <p>
<label for="input__emailaddress">Email Address</label> <label for="input__emailaddress">Email Address</label>
@@ -465,7 +472,7 @@
</section> </section>
</main> </main>
<footer role="contentinfo"> <footer role="contentinfo">
<p>Made by <a href="http://twitter.com/cbracco">@cbracco</a>. Code on <a href="http://github.com/cbracco/html5-test-page">GitHub</a>.</p> <p>Made by <a href="https://twitter.com/cbracco">@cbracco</a>. Code on <a href="https://github.com/cbracco/html5-test-page">GitHub</a>.</p>
</footer> </footer>
</div> </div>
</body> </body>

2
package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "html5-test-page", "name": "html5-test-page",
"version": "0.9.0", "version": "0.9.1",
"description": "A page filled with common HTML elements to be used for testing purposes.", "description": "A page filled with common HTML elements to be used for testing purposes.",
"main": "index.html", "main": "index.html",
"scripts": { "scripts": {