HTML Attributes
All HTML elements can have attributes
Attributes provide additional information about an element
Attributes are always specified in the start tag
Attributes usually come in name/value pairs like: name="value"
The href Attribute
HTML links are defined with the <a> tag. The link address is specified in
the href attribute:
Example
<a href="[Link] is a link</a>
The src Attribute
HTML images are defined with the <img> tag.
The filename of the image source is specified in the src attribute:
Example
<img src="img_girl.jpg">
The width and height Attributes
Images in HTML has a set of size attributes, which specifies the width and height
of the image:
Example
<img src="[Link]" width="500" height="600">
The image size is specified in pixels: width="500" means 500 pixels wide.
The alt Attribute
The alt attribute specifies an alternative text to be used, when an image cannot be
displayed.
The value of the attribute can be read by screen readers. This way, someone
"listening" to the webpage, e.g. a blind person, can "hear" the element.
Example
<img src="[Link]" alt="NO Image">
The alt attribute is also useful if the image does not exis
The style Attribute
The style attribute is used to specify the styling of an element, like color, font, size
etc.
Example
<p style="color:red">I am a paragraph</p>
HTML Comment Tags
Comment tags are used to insert comments in the HTML source code.
<!-- This is a comment -->
<p>This is a paragraph.</p>
<!-- Remember to add more information here -->
HTML LIST
Understanding HTML Lists
There are three different types of list in HTML and each one has a specific purpose
and meaning:
Unordered list — Used to group a set of related items, in no particular order.
Ordered list — Used to group a set of related items, in a specific order.
Description list — Used to display a list of terms and their descriptions.
HTML Unordered Lists
An unordered list created using the <ul> tag, and each list item starts with
the <li> tag.
The list items in unordered lists are marked with bullets (small black
circles), by default.
Unordered lists can be preceded by anyone of several bullet styles; a closed
circle, an open circle, or a square.
EXAMPLE
<html>
<head>
<title> javatechig | list example </title>
</head>
<body>
<h1> mobile operating system</h1>
<ul>
<li> android
<li> blckberry
<li> iphone
<li> windows phone
</ul>
<h1>mobile manufacturers</h1>
<ul type = "square">
<li> samsung
<li> htc
<li type = "disc"> micromax
<li type = "circle"> apple
</ul>
</body>
</html>
HTML Ordered Lists
An ordered list, created using the <ol> tag, and each list item starts with
the <li> tag. Ordered list contain information where order should be emphasized.
Attribute TYPE: (1 | a | A | i | I )
Changes the style of the list.
TYPE = “1” (Arabic Numbers)
TYPE = “a” (Lowercase alphanumeric)
TYPE = “A” (Uppercase alphanumeric)
TYPE = “i” (Lowercase Roman numbers)
TYPE = .1″ (Uppercase Roman numbers)
<html>
<head>
<title> list example </title>
</head>
<body>
<h1>mobile manufacturers</h1>
<ol type = "a">
<li> samsung
<li> htc
<li> micromax
<li> apple
</ol>
</body>
</html>
HTML Definition Lists
A definition list is a list of items, with a description of each item.
The definition list created using <dl> tag. The <dl> tag is used in conjunction
with <dt> — defines the item in the list, and <dd> describes the item in the list:
EXAMPLE
<dl>
<dt>Bread</dt>
<dd>A baked food made of flour.</dd>
<dt>Coffee</dt>
<dd>A drink made from roasted coffee beans.</dd>
</dl>
HTML Text Formatting Tags
Tag Description
<b> Defines bold text
<big> Defines big text
<em> Defines emphasized text
<i> Defines italic text
<small> Defines small text
<strong> Defines strong text
<sub> Defines subscripted text
<ins> Defines inserted text
<del> Defines deleted text
HTML "Computer Output" Tags
Tag Description
<code> Defines computer code text
<kbd> Defines keyboard text
<samp> Defines sample computer code
<tt> Defines teletype text
<var> Defines a variable
<pre> Defines preformatted text
HTML Citations, Quotations, and Definition Tags
Tag Description
<abbr> Defines an abbreviation
<acronym> Defines an acronym
<address> Defines contact information for the author/owner of a document
<bdo> Defines the text direction
<blockquote> Defines a long quotation
<q> Defines a short quotation
<cite> Defines a citation
<dfn> Defines a definition term