Additional CSS practice - CSS Tutorial

Contents

• Introduction Introduction

  • The power of selectors

    45s
• 1. Review of Basic CSS 1. Review of Basic CSS

  • CSS terminology

    2m 58s
  • Type selectors, classes, and IDs

    2m 1s
  • Selector lists

    1m 52s
  • Compound selectors

    3m 19s
• 2. Combinator Selectors 2. Combinator Selectors

  • The HTML family tree: Parents, children, ancestor, descendant, and siblings

    3m 30s
  • Descendant selectors

    3m 36s
  • Parent-child selectors

    3m 51s
  • Adjacent and general sibling selectors

    4m 6s
  • Reading and writing selectors

    1m 47s
• 3. Attribute Selectors 3. Attribute Selectors

  • Simple attribute selectors

    2m 47s
  • Exact and partial attribute value selectors

    3m 26s
  • Beginning, ending, and arbitrary substring attribute value selectors

    3m 13s
  • Cool attribute selector tricks

    4m 30s
• 4. Pseudo-classes for document structures 4. Pseudo-classes for document structures

  • Understanding only selectors, :only-child, :only-of-type

    2m 22s
  • Understanding first and last selectors, :first-child, :first-of-type, :last-child, :last-of-type

    3m 7s
  • Understanding nth selectors – :nth-child, :nth-of-type, :nth-last-child, :nth-last-of-type

    4m 9s
  • :root and :empty

    4m 27s
• 5. Pseudo-classes for links 5. Pseudo-classes for links

  • Basic link states: :link, :visited, :hover, :active

    4m 10s
  • :any-link for combining link states

    1m 34s
  • Pseudo-classes for in-page navigation, :target

    1m 51s
  • Accessibility pseudo-classes: :focus, :focus-within

    5m 22s
• 6. Pseudo-classes for forms 6. Pseudo-classes for forms

  • Form controls: :required and :optional; :enabled and :disabled

    5m 55s
  • Form controls: :read-only and :read-write

    5m 57s
  • Form control states: :indeterminate, :default, :checked

    6m 41s
  • Text fields: :autofill, :placeholder-shown

    7m 2s
  • Error checking: :valid, :invalid, :in-range, :out-of-range

    8m 15s
• 7. Additional pseudo-classes, pseudo-elements, and the universal selector 7. Additional pseudo-classes, pseudo-elements, and the universal selector

  • Comparing is() and where()

    10m 18s
  • Understanding :not

    2m 53s
  • :has()

    7m 14s
  • Meet the pseudo-elements ::before, ::after, ::first-line, ::first-letter

    5m 23s
  • *, the universal selector

    4m 7s
• 8. Choosing Selectors 8. Choosing Selectors

  • CSS selectors and browser support

    1m 55s
  • Why can't I use CSS classes exclusively? Selectors best practices

    3m 5s
  • Impact of CSS selectors on performance

    47s
• Conclusion Conclusion

  • Additional CSS practice

    47s