Posted By

LeeRJohnson on 06/14/09


Tagged

css style lorem ipsum guide


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

exanimo9
LeeRJohnson


HTML Lists Guide


 / Published in: HTML
 

  1. <p>This is a paragraph before <strong>unnumbered</strong> lists (<code>ul</code>).
  2. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
  3. euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
  4.  
  5. <ul>
  6. <li><p>List item content wrapped in a <code>p</code>. Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p></li>
  7. <li><p>List item content wrapped in a <code>p</code>. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.</p></li>
  8. <li><p>Multiple <code>p</code> elements in a list item. Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.</p>
  9. <p>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</p>
  10. </li>
  11. </ul>
  12. <ul>
  13. <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
  14. <li>Aliquam tincidunt mauris eu risus.</li>
  15. <li>Vestibulum auctor dapibus neque.</li>
  16. </ul>
  17.  
  18.  
  19. <p>This is a paragraph before a <strong>numbered</strong> list (<code>ol</code>).
  20. Note that the spacing between a paragraph and a list before or after that is hard
  21. to tune in a user style sheet. You can't guess which paragraphs are logically related
  22. to a list, e.g. as a "list header".</p>
  23. <ol>
  24. <li>One.</li>
  25. <li>Two.</li>
  26. <li>Three. </li>
  27. <li>Four. </li>
  28. <li>Five</li>
  29. <li>Six</li>
  30. <li>Seven</li>
  31. <li>Eight</li>
  32. <li>Nine</li>
  33. <li>Ten</li>
  34. </ol>
  35. <p>This is a paragraph before a <strong>definition</strong> list (<code>dl</code>).
  36. In principle, such a list should consist of <em>terms</em> and associated definitions.
  37. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
  38. euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
  39. <dl>
  40. <dt>Apple</dt>
  41. <dd>
  42. is a fruit.</dd>
  43. <dt>Banana</dt>
  44. <dd>
  45. Is also a fruit.</dd>
  46. <dt>Tomato</dt>
  47. <dd>
  48. Is debatable. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
  49. nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</dd>
  50. </dl>

Report this snippet  

You need to login to post a comment.