CSS Fundamentals
Set CSS Properties and Values (syntax)
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.
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.