6 - Indenting Spacing and Listing

Indenting Paragraph

    Indenting paragraphs is very simple, yet you will notice that many people do not do it. You simply indent by adding blank spaces. "BUT MY BROWSER IGNORES MY SPACES!!!" you say. Everyone’s does, no you use the html coding to make the browser pay attention to spacing.   
     That thing is an ampersand command that creates a space as if you pushed the space bar.   This is what each of these indented lines look like:

Did you see the spaces?  This is the code:

     And that's all I have to say about that. There may be another method, but this is what I do and I am after all the queen of the realm..

Bullet Lists

These lists are nice. Here's why I like them...

   They present information in an easy fashion.

   The bullets look cool.

   They make me happy.

     Here's how I did it.

• They present information in an easy fashion.
• The bullets look cool.
• They make me happy.

      Don't be put off by the commands. It's actually only two being used again and again. Here's what's happening.

   UL stands for Unordered List. It means bullets will be used rather than numbers. Numbers will be explained later.

   LI stands for List Item. It denotes the next thing that will receive a bullet. Please note that no is required. Neither is a Break or Paragraph command. The LI does all that good stuff for you.

   /UL ends the entire list.

HINT: If you use a center command before this, it doesn't center the entire list, it centers each item messing up the look of the list. If you would like to move the list closer to the center of the page, simply add more

• commands. I have found that three moves the list almost to the center. Just remember, if you use three UL commands you need to offer three /UL commands. Like this:

   

   

  • • 
      
      • list item

   

  

  I don't want round bullets, I want squares!!!

       You can have your list and squares too. Simply add the command "square" into your UL command. Like so:

   

  
  
  • List Item 1
  • List Item 2
  • List Item 3

   

  This is what you get...

     List Item 1

     List Item 2

     List Item 3

  

  Number Lists

       If you would like to create a list that numbers the items rather than just putting a bullet in front, HTML could do that for you too. You could just number the things yourself, but that's no fun. It's time consuming too.  This is easier.

  1.    List Item 1

  2.    List Item 2

  3.    List Item 3

  ...and here's how I did it:

  
  
  1. List Item 1
  2. List Item 2
  3. List Item 3

   

       Notice it's just the same format except you have 

  1.  where
     •  used to be. Easy. The browser will continue to count up as long as you keep putting
     • items after the OL. Do you know what "OL" stands for? Ordered List.  Simple hun?

        

       Roman Numerals.

            Place a "I" inside the OL command. Notice that is a capital "I" and not the number one. Here's what you get:

       1. List Item 1
       2. List Item 2
       3. List Item 3

       Notice how the I’s come out and here's how its donet:

       1. List Item 1
       2. List Item 2
       3. List Item 3

        

       Roman Numerals?!?! How about Letters!

            OK, regular letters can be done. Try this:

       A.    List Item 1

       B.    List Item 2

       C.    List Item 3

       ...and here's how its done:

        

       
       
       1. List Item 1
       2. List Item 2
       3. List Item 3

        

       But What if I Don't Want Capital Letters!

            So much to do and so little time.

            You can turn the letters or the Roman numerals to lower case letters by putting the lower case version of the letter in the OL flag. like so:

        

       
       
       
       1. and

           

           

           

               Give it a shot.

          

          Start the Count After One

               Maybe you don't want your count to start at one every time. That's easy to fix. Here's an ordered list that starts at four.

          4.    List Item 1

          5.    List Item 2

          6.    List Item 3

          ...and here's how I did it:

           

           

          Try it yourself.

          

          Can I put these together?

               Yes. Just remember to close each one. You could do something like an OL list and under each LI command for the OL, you could put in a small UL. Like so:

          1.    Main Heading

             List item 1

             List item 2

          2.    Secondary Heading

             List item 1

             List item 2

          here's what it looks like:

           

           

               There is a pattern to putting unordered lists under one another.

             The first list gives you the solid bullet

             The second gives you the empty bullet. You can see that above.

             Each list after that gives you a square bullet.

          

          The Definition List

               You can play with the text all you want inside of all these list commands. Bold, italic, and any other one you want will work. There's one more set of list commands that manipulate the text for you.      The lists above are all single item lists. Each LI command makes one list item. Now check this out:

          Here's What's For Dinner

          Salad

          Green stuff and dressing

          The Meal

          Mystery meat and mashed yams

          Dessert

          A mint

          ...and here's what it looks like.

           

          Here's What's For Dinner

          
          

          Salad

          Green stuff and dressing

          The Meal

          Mystery meat and mashed yams

          Dessert

          A mint

           

          Here's What's Happening

               It looks great. Well...now you know. Use the list commands and present information to your readers in a smoother fashion than writing long drawn out paragraphs with a lot of detail. They’re quicker and easy to do.  Well that’s it for this lesson.  It’s more then enough.  Now it’s assignment time.  Go to it!!

           

          1. 
             
             4. List Item 1
             5. List Item 2
             6. List Item 3
             
             
             1. Main Heading
                
                
                • List item 1
                • List item 2
             2. Secondary Heading
                
                
                • List item 1
                • List item 2
             •  I used an H4 command to create a heading

             •  stands for Definition List. It tells the browser that a double tier list is coming up.

             •  stands for Definition Term. It's the first tier.

             •  stands for Definition Description. It's indented and appears to modify the definition term.