ExpertRating - Online Certification and Employment Testing ExpertRating - Online Certification and Employment Testing ExpertRating - Online Certification and Employment Testing

ExpertRating Home
ExpertRating Benefits
Recommend ExpertRating
Suggest More Tests
Privacy Policy
CSS Tutorial - Index
CSS Tutorial - Introduction to CSS
CSS Tutorial - Basic CSS Concepts
CSS Tutorial - Linking Style Sheets
CSS Tutorial - Text Formatting
CSS Tutorial - Backgrounds
CSS Tutorial - Fonts
CSS Tutorial - Borders
CSS Tutorial - Margins and Padding
CSS Tutorial - Lists
CSS Tutorial - Dimensions
CSS Tutorial - Display and Positioning
CSS Tutorial - Pseudo Classes and Elements
CSS Tutorial - W3 Standards,Validation of Style

Online Personal Trainer Certification
Personal Trainer Certification (Spanish)
Six Sigma Certification
Find a Personal Trainer
Project Management Certification
Six Sigma Certification
Six Sigma Black Belt Certification
Master Black Belt Certification
Six Sigma Green Belt Certification
Life Coach Certification
Lean Management Certification
Lean Six Sigma Certification
First Aid Certification
CPR Certification
Yoga Certification
Aerobics Certification
Pilates Certification
Business Analyst Certification
SEO Certification
Online Business Writing Course & Certification
Makeup Artist Certification
Baby Sitting Course & Certification
Time Management Certification
Health Club Management Certification
Medical Coding Certification
Medical Billing Certification
Business Analysis Course
Master Trainer Certification
Total Quality Management Certification
Kaizen Certification
Creative Writing Certification
Event Management Certification
Test Search by Job Title
Administrative Assistant Certification
Virtual Assistant Certification
  All Online Courses


  Home > Courses, Tutorials & eBooks > CSS Tutorial > Working with Lists

CSS Tutorial - Working with Lists

    Page 2 of 2

With CSS it is possible to determine how the list-item marker will be placed in relation to the content of the list-item.

  • It can have the values: outside or inside.
  • Outside- This is the default value. This marker is placed outside the text. Wrapping text is not indented under the marker. Only the first line is indented. Subsequent lines are not aligned under the marker.
  • Inside - This marker is placed inside the text. The text lines up with the marker on the left margin. It makes the second and subsequent lines of a list item left-indented with the marker.
Example for Outside Marker
ul{ list-style-position : inside;}
    Select your flavor:
  • vanilla
  • strawberry
  • black currant
  • chocolate
Example for Inside Positon
ol {list-style-position: outside;}
    Select your subject :
  1. java
  2. c/c++
  3. .net
  4. unix

In this chapter you have learnt:

  • How lists are used for organizing data
  • Various list style options available
  • Different list styles and their corresponding values
  • Employing images in lists, in place of the normal bullets
  • Positioning the list-item marker
Review Questions

Fill in the Blanks

  1. Lists are used to organize data in a _____ manner.
  2. Types of lists are ______ and _____.
  3. Square, circle, disc, and none are the values of _____ list-type.
  4. Values for list-style-image are _____ and _____.
  1. Linear
  2. Unordered list, ordered list
  3. Unordered
  4. None, URL

State whether True or False

  1. If an ordered-list-type has value as lower-alpha, then it can start the list from 'd' alphabet also.
  2. The default list-item-type has value none.
  3. List-style-position determines how the list-item-marker will be placed in relation to the marker of the list.
  4. The default list-style position value is inside.
  1. True
  2. False
  3. False
  4. False
Create a list showing all the list styles.
What's Next

The next chapter will introduce the concepts of setting dimension around objects. The chapter will also discuss setting the height, and width of various HTML elements.

              Hop over to the next chapter to get a close-up on dimension properties. 



Home  |  About Us  |  Privacy Policy  |  Site Map  |  FAQs  |  Contact Us
© ExpertRating 2015. All Rights Reserved.