CSS Example

Style Format

<p style=" color: red; font-style: italic;">


<style>
 p {color: red;
   font-style:italic; }
 .class {font-style:italic;}
</style>


<link rel = "stylesheet" href =“MyStyle.css"> </link>

Property

color: red;

font-style: italic;

font-family: Verdana;

font-size: 150%;

text-align: center;

background-color: royalblue

width: 200px

text-decoration: underline;

text-decoration: line-through;

  • list-style-type: circle;
  • border: 1px solid black;

    border-style: dotted;

    margin-left: 20px;


    Selectors

    advanced selector

    .class (all elements with class="class")

    #id (the element with id="id")

    * (all elements)

    p (all <p>)

    div, p (all <div> and all <p>)

    div p (all <p> inside <div>)

    dir > p (all <p> where the parent is a <div>)

    div + p (a <p> after <div>)

    Pseudo selectors

    :hover (mouse over link)

    :link (unvisited link)

    :visited (visited link)

    :active (selected link)

    :first-child (first element)

    :nth-child(n) (n element - n form 1)

    :nth-last-child(n) (counting from the last child)

    :not(p) (every element not <p>)