In HTML you can create various types of lists: unordered (UL), ordered (OL).
These HTML lists are block-level elements.
An unordered list (also called 'bulleted list') starts with a <ul> tag and ends with </ul>.
Within the list, each item is added between <li> and </li> tag.
The list items are marked with bullets.
<h4>Example UL</h4> <ul> <li>HTML course</li> <li>CSS Course</li> <li>PHP - MySQL</li> </ul>
You can set three different types of bullets: disc, circle, and square. They are defined with the list-style-type CSS property, in style.
• 'disc' is the default bullet type, so you don't need to specify it.
<h4>Example UL - circle, square</h4> With 'circle' type: <ul style='list-style-type:circle'> <li>HTML course</li> <li>CSS Course</li> <li>PHP - MySQL</li> </ul><br> With 'square' type: <ul style='list-style-type:square'> <li>HTML course</li> <li>CSS Course</li> <li>PHP - MySQL</li> </ul>
An ordered list (also called 'numbered list') is a block element that begins with an <ol> tag and ends with </ol>, it displays the lists with numeric order.
The content for lists is added between <li> and </li>.
The default type of numbered list uses standard numbers.
<h4>Example OL</h4> <ol> <li>HTML lessons</li> <li>Ajax tutorials</li> <li>JavaScript course</li> </ol>
You can specify different types of numbering by adding the type attribute to the <ol> tag, as described in the following list:
<h4>Example OL with type</h4> <ol type='a'> <li>List item 1 ...</li> <li>List item 2 ...</li> <li>List item 3 ...</li> </ol><br> - Another list, type='I': <ol type='I'> <li>List item 1 ...</li> <li>List item 2 ...</li> <li>List item 3 ...</li> </ol>
Also, see this CSS tutorial, Define Custom List-item Markers, Bullets for UL, OL Lists:
coursesweb.net/css/define-custom-list-item-markers-bullets-ul-ol
By default, HTML starts each numbered list with 1 or the equivalent in the numbering scheme used (i, I , a , A).
To change the starting number, add the start attribute to the <ol> tag, and specify the appropriate number.
The numerotation of the lists can be reversed with the reversed attribute.
<h4>Example OL with start and reversed</h4> OL with start='3' <ol start='3'> <li>List item 1 ...</li> <li>List item 2 ...</li> <li>List item 3 ...</li> </ol><br> - Another list: type='i', start='3' and reversed: <ol type='i' start='3' reversed> <li>List item 1 ...</li> <li>List item 2 ...</li> <li>List item 3 ...</li> </ol>
<h4>Example nested list</h4> <ol> <li><p>Here is a paragraph<br /> A new line in the paragraph.</p></li> <li>HTML lessons: <ul type='square'> <li>Adding images</li> <li>DIV and SPAN</li> </ul> </li> <li>Another list item</li> </ol>
Note, all he content of the nested <ul> ... </ul> is added within a <li> </li>.
<ul> <li>http://coursesweb.net/html/</li> <li>http://coursesweb.net/css/</li> </ul>
.some_class {
display: list-item;
}var obj = {
"courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr); // {"courses":["php","javascript","ajax"]}$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue; // CoursesWeb.net