CSS3 Attributes and Selectors Tutorial Videos for Beginner

1
CATCH EXPERTS
https//www.catchexperts.com
http//www.courseing.com
2
CSS3 Pseudo classes and Elements Tutorial Videos
for Beginners by
3
Highlights

• Pseudo Classes Introduction
• Types of pseudo classes
• Explanation of pseudo classes
• Pseudo Elements

4
Pseudo Classes Introduction

• Used to describe a unique state of an elements.
• It is a keyword added to selectors to find out
  status.
• It changes the style and links visibility
  whenever a user hover on particular elements.
• Syntax selectorpseudo-class 
  propertyvalue
• Pseudo-classes could be combine with Cascading
  Style Sheet classes.   

5
Types of pseudo classes

• Basically pseudo classes are five types, they are
  

6
Explanation of pseudo classes

• hover, active, and focus are dynamic pseudo class
  types.
• hover pseudo-class applicable when users
  designates an element,
• active pseudo-class applicable when an element
  is being activated by users,
• focus pseudo-class applicable when an element
  has the focus.
• language pseudo class used to match an element
  based on its language.
• target pseudo class represents the unique
  element.

7
Explanation of pseudo classes

• Target pseudo classes point out unique elements.
• Syntax target style properties
• Structural pseudo-classes useful to separate
  background styles from web content.
• select child elements of a parent based on
  different standard criteria's.
• Negation pseudo classes takes one elements as
  argument and selects element that is not
  represented by the argument. Syntax not(
  ltselectorgt ) style properties
•        

8
Pseudo Elements

• Useful to style particular parts of elements.
• With these elements we can style first letter or
  an entire context line or a particular element.
• Can add content before and after of the
  particular elements using after , before
  elements
• Syntax divafter or before content "hi"
  ,
• Pseudo elements are also added to selectors like
  pseudo classes to style elements.

9
Pseudo Elements

• first-line pseudo-element applies styles to the
  first line of elements.
• first-letter pseudo element allows to style the
  first letter of elements.
• selection pseudo element applies rules to the
  parts of highlighted documents.
• backdrop pseudo element is a box rendered right
  away below the element.
• placeholder  pseudo element represents
  the placeholder text of a form element.
•  marker  pseudo element represents the marker
  box of a list item.
• spell,grammar elements represents text
   flagged by browser having verbal errors.
•  

10
Feedback
Like It ? Hate It?
We would love to hear from you whatever you think
about the course.
Click HERE to share what you think!
11
Thank you
Thank You for Watching CSS3 Pseudo Classes and
Elements Tutorial Videos for Beginner by
http//www.courseing.com