Basic of CSS

Advertisements

History of CSS Selector in CSS

Introduction of CSS

CSS stands for Cascading Style Sheets. Styles define how to display the HTML elements

Definition of CSS

Cascading Style Sheets (CSS) is a rule based language that applies styling to HTML elements. We write CSS rules in Html elements (<p>, <img>), and modify properties of those elements such as color, background color, width, border thickness, font size, etc.

CSS rule, is made up of two parts

  • Selector
  • Declaration
css

Selector

Identifies the HTML elements that the rule will be applied to, identified by the actual element name, e.g. <body>, <p>, <h1>

Declaration

Declaration part contains property and value.
Example: suppose that we want size of our text 10px then it declare as font-size:10px. Here font-size is properties and 10px is there value, and all this declaration is called declaration.

The declaration is also split into two parts, they are separated by a colon " : "

Syntax

font-size:15px;

In the above code properties (font-size) and value (15px) is separated by colon ":"

  • Property
  • Value

all the CSS syntax is combination of these fives things

  • selector
  • property/value
  • declaration
  • declaration block
  • curly braces

Selector

Identifies the HTML elements that the rule will be applied to, identified by the actual element name, e.g. <body>, <p>, <h1>

css selector

Example of Selector

h1
{
color:red;
font-size:10px;
}

We can also define multiple selector at a time. Each selector separated by comma.

Example of use multiple Selector

Example

h1, h2, h3
{
color:red;
font-size:10px;
}

Property & value

The properties is the style attribute you want to change and values is value of attribute.
Example: suppose that we want to change size of our text 10px and color is red then it declare as font-size:10px; color:red. Here font-size is properties and 10px is there value and color is also properties and red is there value

css

Declaration

Declaration part contains property and value.
Example: suppose that we want size of our text 10px then it declare as font-size:10px. Here font-size is properties and 10px is there value, and all this declaration is called declaration.

css

Declaration Block

Declaration Block is multiple declaration lines including the curly braces

css

The declaration is also split into two parts, they are separated by a colon " : "

Syntax

font-size:15px;

In the above code properties (font-size) and value (15px) is separated by colon ":"

Curly Braces

css

Note: If there is only one property - value pair in the declaration, we do not need to end it with a semicolon.

However, because a declaration can consist of several property - value pairs, and each property - value pair within a rule must be separated by a semicolon.


History of CSS Selector in CSS

Google Advertisment

Buy This Ad Space @$20 per Month, Ad Size 600X200 Contact on: hitesh.xc@gmail.com or 9999595223

Magenet is best Adsense Alternative here we earn $2 for single link, Here we get links ads. Magenet

For Projects 9999595223

Google Advertisements


Buy Websites 9999595223

Buy College Projects with Documentation Contact on whatsapp 9999595223. Contact on: hitesh.xc@gmail.com or 9999595223 Try this Keyword C++ Programs

Advertisements