HTML and CSS Lessson 6

Create and style the sidebar

Lesson 5 Lesson 7

Notes:

CSS Notes:

float property:

  • The float property specifies whether or not a box (an element) should float.
    Syntax float: none | left | right;

list-style property:

  • The list-style shorthand property sets all the list properties in one declaration.
    Syntax list-style: list-style-type list-style-position list-style-image;
    1. The list-style-image property replaces the list-item marker with an image.
      Syntax list-style-image: none | url('your image');
    2. The list-style-position specifies if the list-item markers should appear inside or outside the content flow.
      Syntax list-style-position: inside | outside;
    3. The list-style-type specifies the type of list-item marker in a list.
      Syntax list-style-type: value;
      Values:
      <ul> vlaues:
      • list-style-type: disc | circle | none | square;
      <ol> vlaues:
      • list-style-type: armenian | cjk-ideographic | decimal | decimal-leading-zero | georgian | hebrew | hebrew | hiragana-iroha | katakana |katakana-iroha | lower-alpha | lower-greek | lower-latin | lower-roman | none | upper-alpha | upper-greek | upper-latin | upper-roman;

display property:

  • The display property specifies the type of box used for an HTML element.
    Syntax display: none | block | list-item | inline;