What is CSS?
The full form of CSS is Cascading Style sheets, it is a type of language through which we design our website.
In simple language, CSS tells your browser what will be the font, color, size, position etc. of the contents (like text, image, paragraph etc.) available in the web page.
It is very easy to learn CSS, we have made a complete tutorial of CSS for you in Hindi, by reading and practicing which you can easily learn to create an attractive website.
Keep in mind that nothing can be created with CSS without HTML, hence it is important for you to have knowledge of HTML.
HTML and CSS together provide the look and shape to a web page.
HTML gives shape to the webpage and the job of CSS is to make the webpage attractive.
Why is CSS important? What are its benefits?
Let us know what benefits you will get if you use CSS in your website:
The design is easy to maintain:
Let us assume that we have created a website with only HTML without using CSS which has 50 pages, now we want that the design of all the pages should be the same, so we design one page and make 50 pages by copy-pasting it. There is no problem in this, after this we add content to all the pages.
Now the website is ready but in future if we have to make some changes in the design like we have to change the color of heading of all the pages to blue then we will have to go to each page and make changes which will be a very time consuming task.
If we use CSS then this work becomes very easy because with CSS we separate the design of the page from the content part, now when we need changes in the design, we can easily go to the CSS file. Make changes which are applied to the entire website.
Website speed increases:
If we use Cascading Style Sheets, the loading speed of the web page increases because we create a separate file for CSS and when you visit any page of the website, that CSS file is stored in your browser cache. It gets stored, after this when you go to another page of the same site, your browser will not need to download that CSS file again.
But if you do not use CSS and you have designed the layout from HTML table then page loading will be slow because the browser will have to understand this table every time in every page.
You can show the design according to the device:
You must have noticed that the designs of some sites appear different on desktop and different on mobile devices. When you take a printout of the result from the exam result website, why is only the result part printed? Why are the rest of the headers and sidebars not printed? ,
This is because they show the design according to the device through CSS, they tell the browser what to show if the device is mobile and which part to print if the device is a printer.
How to apply CSS in a web page?
You can apply CSS in a web page in three ways. Let us know which are those three ways:
1. Internal style sheet (Internal CSS style) :
In internal CSS style, we write the CSS code inside the <head> tag of the html of the page in which the CSS style is to be applied.
2.External style sheet :
In this method, we create a separate file and write CSS code in it and save it with .css extension, then link this file in the HTML page in which the style is to be applied.
To link CSS file, use <link> tag in <head> section of HTML
3. Inline style sheet :
In the HTML element in which style is to be applied, we directly apply the CSS property from the style attribute in its tag.