Menu
The <li> tag defines a list item. The <li> tag is used inside ordered lists(<ol>), unordered lists (<ul>), and in menu lists (<menu>). In <ul> and <menu>, the list items will usually be displayed with bullet points. In <ol>, the list items will usually be displayed with numbers or letters.
<li>: The List Item element. The <li> HTML element is used to represent an item in a list. It must be contained in a parent element: an ordered list ( <ol> ), an unordered list ( <ul> ), or a menu ( <menu> ).
For semantic purposes, content within the li element should be wrapped in a p tag. If there is more than one paragraph or section in a li , do not close the li until after the last element. This differs from the current standard, but is cleaner for accessible content.
Yes you can use a div inside a li and it will validate.
TL;DR: an <li> can contain any element that is valid in <body>.
In the HTML 4.01 spec for lists you’ll find the relevant extract of the DTD:
<!ELEMENT LI - O (%flow;)* -- list item -->
This specifies that an <li> may contain flow content, which is the collection of all block and inline elements.
The HTML5 spec for an <li> is the same in that it also allows any flow content.
It's a block level element so pretty much anything goes. Trouble only comes when you're putting block level elements inside inline ones.
Yup, pretty much. You can have lists inside lists (either inside the the inner list must be inside an <li> or just loose inside the <ol>/<ul><li>), block elements and inline elements.
To me it wouldn't make much sense to put a <table> inside an <li>, but even that's still valid.
You can use the W3C's Markup Validation Service to test against your cases to know whether or not your markup is valid.
This validator checks the markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With