Pseudo-elements are similar to pseudo-classes, but instead of a specific state or order of an element, you can style certain parts of an element. This video goes over some examples.
- [Instructor] Pseudo-Elements are very much…like pseudo-classes but instead…of targeting a specific state or order of an element,…you can style certain parts of the element…that are not explicitly part of the html.…In older versions of CSS, pseudo-elements…were preceded by a single colon.…In CSS3, which is the latest version,…they use a double colon notation…to differentiate from pseudo-classes.…All modern browsers support both syntaxes.…Unless you need to support Internet Explorer 8…or below it's fine to use either notation.…
I'll be sticking with single colons.…Two pseudo-elements we've already seen…in a previous lesson are :before and :after.…It's used in what's commonly referred…to as the "box model fix"…for changing the way elements are sized.…Aside from changing element sizing,…:before and :after are used to generate content…or style elements that are inserted…before or after a selected element.…These pseudo-elements do not become part…of the actual HTML structure.…
It is only visually displayed.…For accessibility, :before and :after…
- Reviewing CSS syntax
- Reviewing simple selectors and attribute selectors
- Using pseudo-class selectors and pseudo-element selectors
- Reviewing the CSS box model
- Adding a menu to your project
- Using float, display, and position
- Debugging CSS
- Resetting stylesheets
- Working with background images
- Exploring a mobile-first approach for responsive web design
- Creating flexible and fluid layouts
Skill Level Beginner
Building Responsive Forms with Flexboxwith James Williamson1h 20m Intermediate
1. CSS Selectors
3. Tips and Tools
4. Responsive and Mobile
- 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.