CSS

CSS stands for Cascading Style Sheets. It is the language used to describe the appearance of webpages. CSS makes good use of the class attribute, id attribute, and the elements for content division. CSS defines rules for which elements get which styles. CSS can control things like position, color, and size.

This is what CSS looks like:

/* styles.css */
.purple {
    color: purple;
}

.dotted-underline {
    text-decoration: underline dotted;
}

section > h2 {
    font-size: 32px;
    font-family: 'Segoe UI', Verdana, sans-serif;
}
<!-- index.html -->
<section>
    <h2>Lorem Ipsum</h2>
    <p class="purple">Lorem ipsum dolor sit amet, consectetur adipiscing elit, 
    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
    <span class="dotted-underline"> Amet facilisis magna etiam tempor orci eu 
    lobortis. Consectetur lorem donec massa sapien faucibus et molestie ac.</span></p>
</section>
<section>
    <h2>Consectetur</h2>
    <p class="purple">Lorem ipsum dolor sit amet, consectetur adipiscing elit, 
    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lectus 
    urna duis convallis convallis. Magna eget est lorem ipsum dolor sit amet 
    consectetur adipiscing.</p>
</section>
<section>
    <h2>Amet</h2>
    <p>Lorem ipsum dolor sit amet, <span class="purple dotted-underline">consectetur
    adipiscing elit, sed do</span> eiusmod tempor incididunt ut labore et dolore 
    magna aliqua. Id porta nibh venenatis cras sed felis eget velit. Viverra orci 
    sagittis eu volutpat odio.</p>
</section>

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Amet facilisis magna etiam tempor orci eu lobortis. Consectetur lorem donec massa sapien faucibus et molestie ac.

Consectetur

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lectus urna duis convallis convallis. Magna eget est lorem ipsum dolor sit amet consectetur adipiscing.

Amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id porta nibh venenatis cras sed felis eget velit. Viverra orci sagittis eu volutpat odio.

Syntax

CSS syntax follows this pattern:

selector {
    property: value;
    property-two: value-two;
}

The selector specifies which elements to style. The property and value specify how the elements should be styled. The property and value are separated by a colon and the line ends with a semicolon. And, there can be multiple properties and values contained within the curly braces of a selector.