✖

All TalkersCode Topics

Follow TalkersCode On Social Media

✖

devloprr.com - A Social Media Network for developers Join Now ➔

CSS Syntax

CSS syntax consist of a Selector,Property and Value.


Syntax

Selector { Property:Value; }

Example of CSS Syntax

p { color:blue; font-size:20px; }

Code Explanation

  • Here 'p' is a selector,'color' and 'font-size' is the property and 'blue' and '20px' value of there respective property.

  • You can write property of CSS as many as you want.

Types of Selectors

  • Select By Tag
    • p
{
color:blue;
}

  • Universal Selector

    • It can select all the tag in webpage and change the color of the text to blue.

    *
{
color:blue;
}

  • Select By Class

    • You can define style rules based on the class attribute of the elements. All the elements having that class will be formatted according to the defined rule.

    .demo
{
color:blue;
}

  • Select By Id

    • You can define style rules based on the id attribute of the elements. All the elements having that id will be formatted according to the defined rule.

    #demo
{
color:blue;
}

  • Descendent Selector

    • You can define style rules particular element only when it lies inside a particular element.

    p a
{
color:blue;
}
for class selector
p .demo
{
color:blue;
}
for id selector
p #demo
{
color:blue;
}

  • Select By Child

    • This will change the color to blue of all the paragraphs which are direct child of body element.

    body > p
{
color:blue;
}

  • Select By Attribute

    • This will change the color to blue of all the input fields having value of type is text.

    input[type="text"]
{
color:blue;
}

  • Grouping Selector

    • This will change the color to blue of all the h1,p,a.

    h1,p,a
{
color:blue;
}
    ❮ PrevNext ❯