Learning any new programming language takes practice. In this video, take what you have learned about simple selectors and apply it to some exercises.
- [Instructor] Let's do a small exercise…to get some practice with selectors,…using an online tool called JSFiddle.…This tool is useful for testing…smaller snippets of code.…Go to the following URL…to follow along with the example.…If you'd like to keep your own copy, select Fork.…This will generate a unique URL…that you can save as your own copy,…or create an account to save it to your own profile.…Once you have this example open and ready to go,…let's go through the steps in the HTML comments.…
In JSFiddle, the HTML is in the panel on the left…and we write our CSS in this top right panel.…Number one, let's add a color to the body element.…Let's start with Body as our selector…and then add the left and right curly braces…to open our declaration block.…Use the color property, colon,…and add any keyword color.…Any common color should work.…Let's go with green.…End it with a semicolon…to indicate that the instruction is complete.…
Select Run to see the styles.…By adding the color to the body tag,…all of the nested elements also applies that color.…
- Creating a CSS file
- Writing basic selectors
- Setting properties
- Using different typefaces and web-safe fonts
- Understanding cascading and inheritance
- Setting a font family, font size, text color, and more
- Understanding the box model
- Using the float property
Skill Level Beginner
1. Getting Started
2. CSS Core
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.