1×
Become a member
to unlock all features
Autoplay

    Set CSS Properties and Values (syntax)

    Tyler ClarkTyler Clark
    cssCSS

    The CSS syntax writes somewhat similar to JavaScript objects. It is important to understand where to properly set properties, selectors, and values within your CSS. In this lesson we’ll talk about this syntax and work an example.

    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    Instructor: 00:00 CSS is a language that controls how documents are presented on the Web to users. This means it controls how text, images, and other elements lay out on a page, how they respond to different devices, and so much more.

    00:14 We can write a quick example of CSS by styling some specific content to appear as the color red on the page. CSS has two main components. First, the selector and its corresponding block. This first statement is called a selector. This is how we tell the browser which elements of HTML we want to apply the defined styles to.

    00:35 Everything defined inside of these curly braces will apply to this selector only. These are also called CSS declaration blocks. Inside of these blocks are the CSS declarations.

    00:48 On the left-hand side of the colon, these are called properties. Properties are the feature of the page we want to style. In our case, we want to change the color feature of our h1 selector to be the color red.

    01:01 On the right side of our colon, these are called values. Each property has a specific set of valid values that can be chosen to implement on a website. This is the how we want to change the defined feature.

    01:15 We end each CSS declaration with a semicolon. This is required, or the browser will not render the style correctly.

    Discuss

    Discuss