Today's Progress
Today is the first CSS lesson in Skillcrush's HTML & CSS class. Adda starts this lesson with two videos. One gives a general overview of CSS. The second video goes into some of the CSS text properties and how to write CSS in a style sheet.
To write CSS, you will be creating a CSS block. This block consists of a selector, property name, and property value. For example, look at this sample code below.
p {
color: "blue";
}
We want to change the paragraphs on the website to blue. To do this, I need to select the p tags on my site. This is my selector.
Selectors are what we want to style. They can be anything from headlines, images, and even code sections. After the selector, I use curly braces.
On the next line, I put the property name. This is the style I'm applying to the element. In this example, I want to change the color so I'm going to use the color property name.
Finally put a colon after your property name and put the property value. The property value is how you want to style the property. Here is where I'm going to put a color name or a hexadecimal code. At the end, you put a semi-colon to let the computer know you are done styling that property.
skillcrush focuses on text properties in today's lesson. Today's lesson covers the following properties:
- font-family
- font-size
- color -text-align
- font-style
- font-weight
- text-transform
- font-variant
- text-decoration
- line-height
- word-spacing
- text-indent
New developers don't need to memorize these properties. However, these are great properties for developers to practice using and become familiar with since these will be the ones that you'll use often in your projects.
I did ok in today's practice quiz. I got more questions wrong today than on the previous quizzes. I missed one true or false question.
The question was "You can use uppercase and lowercase letters in the value of the font family property". This is true because the casing of font-family value doesn't impact the functionality. I also forgot one F in the hexadecimal code for one of the exercises.
This gave me an error in my code. New developers will want to double-check the hexadecimal codes they want to use in their code. Using the wrong hexadecimal codes will either not work in the color property or result in a different color appearing on your screen.
Now it was time for the coding activities. First, I modified the CSS properties in the Your First CSS Block exercise. Then I played around with the CSS properties in the Put Your Text Stylin Skillz to Work section.
It still takes me a while to double-check my code but I was able to address all the objectives of the projects. Skillcrush provides cheat sheets to all their students in this class. I used the CSS one today on some of the exercises to double-check my CSS properties and make sure I'm using the right ones in the coding exercises.
New developers don't feel bad about using cheat sheets or any resources that have lists of CSS properties. These resources are there to help you so make sure you use them as you need them.
Tomorrow's Plan
I am moving on with CSS. Tomorrow is the web fonts lesson. This lesson talks about how to add web fonts to a website using Google Fonts.
Google Fonts is a popular resource developers use to add fonts to a website so you'll be using this often as you continue coding. New developers will get a chance to use Google Fonts for the first time to add a web font to a website.
Top comments (0)