revision:
It specifies one or more header cells a table cell is related to. The headers attribute can be used on the <td> and <th> elements.
<th headers="header_id "></th>
<td headers="header_id "></td>
header_id specifies a space-separated list of id's to one or more header cells the table cell is related to.
| Name | Phone | Address | |
|---|---|---|---|
| John Doe | someone@example.com | +45342323 | Rosevn 56,4300 Sandnes,Norway |
codes:
<table style="margin-left:3vw;" style="width:100%">
<tr>
<th id="name">Name</th>
<th id="email">Email</th>
<th id="phone">Phone</th>
<th id="addr">Address</th>
</tr>
<tr>
<td headers="name">John Doe</td>
<td headers="email">someone@example.com</td>
<td headers="phone">+45342323</td>
<td headers="addr">Rosevn 56,4300 Sandnes,Norway</td>
</tr>
</table>
| Name | |
|---|---|
| Firstname | Lastname |
codes:
<table style="margin-left:3vw;">
<tr>
<th id="name" colspan="2">Name</th>
</tr>
<tr>
<th headers="name">Firstname</th>
<th headers="name">Lastname</th>
</tr>
</table>
The height attribute can be used on the following elements: <canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video>.
<canvas height="pixels | %"></ >
<embed height="pixels | %"></ >
<iframe height="pixels | %"></ >
<img height="pixels | %"></ >
<input height="pixels | %"></ >
<object height="pixels | %"></ >
<video height="pixels | %"></ >
Attribute values:
pixels: it sets the height of the cell in terms of pixels.
%: it sets the height of the cell in terms of percentage (%).
codes:
<canvas id="myCanvas" width="200" height="200" style="border:1px solid; margin-left: 3vw;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#92B901";
ctx.fillRect(50, 50, 100, 100);
</script>
codes:
<iframe src="../pics/car2.jpg" width="400" height="200" style="margin-left: 3vw;">
<p>Your browser does not support iframes.</p>
</iframe>
When present, it specifies that an element is not yet, or is no longer, relevant. Browsers should not display elements that have the hidden attribute specified.
The hidden attribute can also be used to keep a user from seeing an element until some other condition has been met (like selecting a checkbox, etc.). Then, a JavaScript could remove the hidden attribute, and make the element visible.
The hidden attribute is a global attribute, and can be used on any HTML element. If something is marked hidden, it is hidden from all presentations, including, for instance, screen readers. A hidden element is not visible, but it maintains its position on the page.
<element hidden></element>
<element hidden="hidden"></element>
You can specify either 'hidden' (without value) or 'hidden="hidden"'. Both are valid.
This content should be read right now, as it is important. I am so glad you are able to find it!
This content is not relevant to this page right now, so should not be seen. Nothing to see here. Nada.
codes:
<p class="spec">This content should be read right now, as it is important. I am so glad you are able to find it!</p>
<p hidden>This content is not relevant to this page right now, so should not be seen. Nothing to see here. Nada.</p>
By clicking "OK" you agree to be awesome every day!
Thank you so much for agreeing to be awesome today! Now get out there and do awesome things awesomely to make the world more awesome!
codes:
<div style="margin-left:3vw;" id="welcome" class="panel">
<h3>Welcome to Foobar.com!</h3>
<p class="spec">By clicking "OK" you agree to be awesome every day!</p>
<button style="margin-left:3vw;" class="button" id="okButton">OK</button>
</div>
<div style="margin-left:3vw;" id="awesome" class="panel" hidden>
<h3>Thanks!</h3>
<p class="spec">Thank you <strong>so</strong> much for agreeing to be awesome today! Now get out there and
do awesome things awesomely to make the world more awesome!</p>
</div>
<script>
document.getElementById("okButton")
.addEventListener("click", function() {
document.getElementById("welcome").hidden = true;
document.getElementById("awesome").hidden = false;
}, false);
</script>
It specifies where the gauge's value is considered to be a high value.
The high attribute value must be less than the "max attribute" value, and it also must be greater than the "low" and "min attribute" values.
This attribute can be used on the <meter> element.
<meter high="number "></meter >
number: contains the floating point number, which is considered to be a high value.
codes:
<p class="spec"><label for="anna">Anna's score:
<meter id="anna" min="0" low="40" high="90" max="100" value="95"></meter></p>
<p class="spec"><label for="peter">Peter's score:</label>
<meter id="peter" min="0" low="40" high="90" max="100" value="65"></meter></p>
<p class="spec"><label for="linda">Linda's score:</label>
<meter id="linda" min="0" low="40" high="90" max="100" value="35"></meter></p>
Sachin's score:
Laxman's score:
codes:
<p class="spec">Sachin's score:
<meter value="2" min="0" max="10" high="6">2 out of 10</meter></p>
<p class="spec">Laxman's score:
<meter value="0.6" max="1.0" min="0" high="0.6">60% from 100%</meter></p>
If the href attribute is not present, the <a> tag will not be a hyperlink. href="#top" or href="#" can be used to link to the top of the current page!
<a href="URL"></a>
URL: the URL of the link. Possible values:
An absolute URL, which points to another web site.
A relative URL, which points to a file within a web site.
A link to an element with a specified "id" within the page.
Other protocols (like https://, ftp://, mailto:, file:, etc..).
A script (like href="javascript:alert('Hello');")
codes:
<p class="spec">An image as a link:
<a href="https://www.lwitters-1.com">
<img border="0" alt="my website" src="cartoon.jpg" width="100" height="100">
</a>
</p>
<br>
<a href="javascript:alert('Hello World!');">execute JavaScript</a>
codes:
<a href="#top">Go to top of this page</a>
<br>
<p class="spec"><a href="mailto:someone@example.com">Send email</a></p>
This attribute is only used if the href attribute is set, i.e. the hreflang attribute requires that href has a value.
Note: This attribute is purely advisory.
Applicable elements: <a>, <area>, <link>.
<a hreflang="language_code"></a>
language_code: a two-letter language code that specifies the language of the linked document.
The first two characters in the "hreflang value" represents the language code, such as 'en'. The last two characters in the "hreflang value" represents the country code, such as 'US'.
codes:
<p class="spec"><a hreflang="en" href="https://www.lwitters.com">my website</a></p>
codes:
<img src="../pics/computer-map.png" alt="Computer" usemap="#computermap">
<map name="computermap">
<area hreflang="en-US" shape="rect" alt="Monitor" coords="253,142,16,2"
href="https://www.google.com/search?q=monitor" target="_blank">
<area hreflang="en-US" shape="rect" alt="Keyboard" coords="262,218,0,156"
href="https://www.google.com/search?q=keyboard" target="_blank">
<area hreflang="en-US" shape="circle" alt="Mouse" coords="267,234,22"
href="https://www.google.com/search?q=mouse" target="_blank">
</map>
It provides an HTTP header for the information/value of the content attribute. It can be used to simulate an HTTP response header.
The http-equiv element is considered obsolete and should not be used. To specify the content type of a document, use the "charset attribute" of the "meta element" instead.
<meta http-equiv="content-security-policy|content-type|default-style|refresh">
content-security-policy specifies a content policy for the document. Example:<meta http-equiv="content-security-policy" content="default-src 'self'">
content-type specifies the character encoding for the document. Example: <meta http-equiv="content-type" content="text/html; charset=UTF-8">
default-style specifies the preferred style sheet to use.Example: <meta http-equiv="default-style" content="the document's preferred stylesheet">. Note: The value of the content attribute above must match the value of the title attribute on a link element in the same document, or it must match the value of the title attribute on a style element in the same document.
refreshdefines a time interval for the document to refresh itself. Example: <meta http-equiv="refresh" content="300">. Note: The value "refresh" should be used carefully, as it takes the control of a page away from the user. Using "refresh" will cause a failure in W3C's Web Content Accessibility Guidelines.
HTML codes:
<head>
<title>HTML http-equiv Attribute</title>
<meta name="keywords about" content="Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="revised about" content="coding page" />
<meta http-equiv="refresh" content="8" />
</head>
HTML codes:
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="cache-control" content="no-store" />