{"id":753,"date":"2007-03-21T14:54:11","date_gmt":"2007-03-21T06:54:11","guid":{"rendered":"http:\/\/www.janleow.com\/life\/?p=753"},"modified":"2007-03-21T14:54:11","modified_gmt":"2007-03-21T06:54:11","slug":"html-05-making-ordered-bulleted-list","status":"publish","type":"post","link":"https:\/\/www.janleow.com\/life\/html-05-making-ordered-bulleted-list.html","title":{"rendered":"HTML Lesson 5: making list"},"content":{"rendered":"

You may want to make a list for easier presentation of information on your website. There are two types of list, unordered bulleted list and ordered numbered list.\n<\/p>\n

\nTo create the unordered list, you will use the “UL” tag together with the list item “LI” tag. There is no need to close the “LI”, as mentioned previously, not every tag will require a closing tag. However, you may still want to close the tag by using “\/LI” for the sake of XML convention which requires a closing tag.\n<\/p>\n

<\/p>\n\n\n
\n
\n<UL>
\n
<LI>List item
\n
<LI>List item
\n
<LI>List item
\n
<\/UL>\n<\/div>\n<\/td>\n<\/tr>\n<\/table>\n


\n<\/p>\n

\nWill become:\n<\/p>\n\n\n
\n
\n

    \n
  • List item
    \n
  • List item
    \n
  • List item
    \n<\/UL>\n<\/div>\n<\/td>\n<\/tr>\n<\/table>\n


    \n<\/p>\n

    \nSimilarly for the order numbered list.\n<\/p>\n\n\n
    \n
    \n<OL>
    \n<LI>List item
    \n<LI>List item
    \n<LI>List item
    \n<\/OL>\n<\/div>\n<\/td>\n<\/tr>\n<\/table>\n


    \n<\/p>\n

    \nWill become:\n<\/p>\n\n\n
    \n
    \n

      \n
    1. List item
      \n
    2. List item
      \n
    3. List item
      \n<\/OL>\n<\/div>\n<\/td>\n<\/tr>\n<\/table>\n


      \n<\/p>\n

      \nYou can also nest the list:\n<\/p>\n\n\n
      \n
      \n<OL>
      \n
      <LI>List item
      \n
          <OL>
      \n
          <LI>List item
      \n
          <LI>List item
      \n
          <\/OL>
      \n
      <LI>List item
      \n
      <LI>List item
      \n
          <UL>
      \n
          <LI>List item
      \n
          <LI>List item
      \n
          <LI>List item
      \n
          <\/UL>
      \n
      <LI>List item
      \n
      <\/OL>\n<\/div>\n<\/td>\n<\/tr>\n<\/table>\n


      \n<\/p>\n

      \nThe display result:\n<\/p>\n\n\n
      \n
      \n

        \n
      1. List item
        \n

          \n
        1. List item
          \n
        2. List item
          \n
        3. List item
          \n<\/OL>
          \n
        4. List item
          \n
        5. List item
          \n\t

            \n
          • List item
            \n
          • List item
            \n
          • List item
            \n<\/UL>
            \n
          • List item
            \n<\/OL>\n<\/div>\n<\/td>\n<\/tr>\n<\/table>\n


            \n<\/p>\n

            \n