Username: Save?
Password:
Home Forum Links Search Login Register*
    News: Welcome to the TechnoWorldInc! Community!
Recent Updates
[March 06, 2024, 02:45:27 PM]

[March 06, 2024, 02:45:27 PM]

[March 06, 2024, 02:45:27 PM]

[March 06, 2024, 02:45:27 PM]

[February 14, 2024, 02:00:39 PM]

[February 14, 2024, 02:00:39 PM]

[February 14, 2024, 02:00:39 PM]

[February 14, 2024, 02:00:39 PM]

[February 08, 2024, 10:26:18 AM]

[February 08, 2024, 10:26:18 AM]

[February 08, 2024, 10:26:18 AM]

[February 08, 2024, 10:26:18 AM]

[November 27, 2023, 06:32:12 PM]
Subscriptions
Get Latest Tech Updates For Free!
Resources
   Travelikers
   Funistan
   PrettyGalz
   Techlap
   FreeThemes
   Videsta
   Glamistan
   BachatMela
   GlamGalz
   Techzug
   Vidsage
   Funzug
   WorldHostInc
   Funfani
   FilmyMama
   Uploaded.Tech
   MegaPixelShop
   Netens
   Funotic
   FreeJobsInc
   FilesPark
Participate in the fastest growing Technical Encyclopedia! This website is 100% Free. Please register or login using the login box above if you have already registered. You will need to be logged in to reply, make new topics and to access all the areas. Registration is free! Click Here To Register.
+ Techno World Inc - The Best Technical Encyclopedia Online! » Forum » THE TECHNO CLUB [ TECHNOWORLDINC.COM ] » Programming Zone » HTML
 How to create lists in HTML and control the way they look
Pages: [1]   Go Down
  Print  
Author Topic: How to create lists in HTML and control the way they look  (Read 906 times)
Daniel Franklin
TWI Hero
**********


Karma: 3
Offline Offline

Posts: 16647


View Profile Email
How to create lists in HTML and control the way they look
« Posted: September 26, 2007, 03:34:15 PM »




There are three kinds of lists that you can create:

- Unordered - Ordered - Definitions

Oops, another list right there! :-)

1) Here is the HTML code for creating Unordered list:

    * Sour cream
    * Spagetti
    * Pancakes



The above code will simply create a list of bulleted items (bullets are small dots next to each item - sort of a check mark).

2) When it is important for you to list items in a particular order, create a numbered - or Ordered - list:

   1. Mix the batter
   2. Put it in the oven
   3. Bake for 20 minutes



Obviously, order of items is important here (you don't want to bake the batter that hasn't been mixed yet :-)

Finally, the Definition lists. They are most often used when you have a list of items to be defined or explained. Use <DL> and </DL> to start and end your list. <DT> will stand for "term" and <DD> will stand for "definition". Using the previous cake baking topic, here is an example of a Definition list:

<DL> <DT>Mix the batter: <DD>Make sure to mix it until well blended or the cake will be lumpy

<DT>Put it in the oven: <DD>You may need to rotate it middle of the baking cycle


<DT>Bake for 20 minutes: <DD>Baking time may vary. Start checking in about 15 minutes. </DL>

When you're creating a complex list, with sub-items, you may use nested lists (list inside another list) and mix different kinds of lists together. Experiment with different combinations of lists to see what is the best way for you to organize items on your web page.

And here is the frosting! Hey, I bet even experienced webmasters might have missed the real flexibility of lists.

Every Ordered list begins counting with "1" by default. Every time you create a list, it automatically display "1" as the first item. But what if you don't want a list to start with "1"? Is it possible for you to control what number it starts counting at?

Let's say you are explaining different features of a product on your web page. You list the first 3 features, but then would like to stop for a moment and talk a little more about the 3rd feature. You have to end the list by using the

tag. Then you will add the extra explanation about it in the next 2-3 paragraphs.

Now, you want to continue with your list. Oops! But you already closed it. If you start a new list, it will automatically begin with "1" again. But you need it to start with "4", right?

Here is what you do:

   1. <li value="4">This item will be number 4 The next one will be 5 and so on.



All I did was add the word "value" and gave it a number. That number will start your list, and all the following list items will be counted from there.

And here is the sprinkles on the frosting. And this will REALLY blow you off!

In an Unordered list bullets look different in each browser. If you would like to have control over how bullets look on your web site, you can specify their type (options are - square, circle, and disc):

      <li type=disc>This item has a black circle bullet <li type=circle>The next one has empty circle as a bullet <li type=square>The last one looks like a square



So there you have it. Three types of lists that you can mix, match, combine and completely control with enough practice and experimentation. Use them often. Especially when you have long web pages filled with text. Be easy on your readers' eyes and they will be more likely to read what you have to say.

Articles Source - Free Articles

Logged

Pages: [1]   Go Up
  Print  
 
Jump to:  

Copyright © 2006-2023 TechnoWorldInc.com. All Rights Reserved. Privacy Policy | Disclaimer
Page created in 0.094 seconds with 24 queries.