Join James Williamson for an in-depth discussion in this video How browsers apply styles, part of CSS Fundamentals.
- While CSS syntax is relatively simple,…the styles themselves, and the pages…that they control, can get rather complex.…As sites become larger and more complex,…it becomes more difficult to keep…styles from conflicting with one another.…This can lead to bloated code,…inefficient CSS, or styles that simply…just don't work.…In order to confidently navigate more…complex page structure, you need to…understand how browsers apply styles.…Once you understand the rules of…style rendering, it becomes much…easier to write organized and efficient CSS.…
First, I wanna take a look at how browsers…read selectors.…You and I are probably used to reading…selectors from left to right.…Now, take the following selector.…This tells the browser to find any text…within a span tag, which is also…inside of a paragraph tag, which is…also found within a div tag, which is…also found within an element with…an ID of main content.…Now, the browser, however, reads this…from right to left.…In this case, the browser would first…find all of the span tags within the page.…
CSS Fundamentals covers the basic concepts, terminology, and techniques you need to read and write CSS. It's for people who want a big-picture overview before taking hands-on courses. Author James Williamson explains how CSS affects text, borders, backgrounds, and images; how CSS works with HTML; and how the W3C's evolving CSS specification impacts designers. He also reviews some of the most popular CSS editors and frameworks and lists online tools and resources for further study.
- What is CSS?
- Basic selector types
- Using CSS with HTML
- How browsers render CSS differently
- Exploring CSS specifications
- Checking browser support
- Working with fonts
- Understanding the box model
- Adjusting margins and padding
- Positioning elements
- Basic CSS layout concepts
- Media types and media queries
- Working with CSS frameworks and CSS grids
Skill Level Beginner
1. CSS Basics
2. CSS Specifications
3. Common CSS Concepts
4. CSS Resources
- 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.