What is CSS? What does CSS stand for? Beginners Guide
Today, I am going to tell you about CSS. Firstly I wanna tell you that this is the most powerful designing language for the webpage. Second, it is not that kind of difficult like C++ and Java, etc. But it’s very cool and fun. I hope you will enjoy learning this language. So Let’s Start:
What is CSS?
- CSS stands for Cascading Style Sheets. It is a style sheet language.
- World Wide Web Consortium (W3C) developed this language.
- It is the most powerful language for designing web pages.
For what we use CSS? And Why?
- It is used to designing HTML webpages.
- CSS describes how to display HTML elements.
- Cascading Style Sheet makes web pages more attractive with his designing properties.
- With CSS we can create responsive websites.
- It specifies HTML documents styles.
Let me show you an example of this language. So let’s see this image below
So let’s talk about how we can start coding in this language? You can use any type of text editor to start coding. Here below is the link to some free text editors you can select what you want and download it: Top 5 Best Text Editors for Windows 2020. After downloading then install it. I will use the visual studio code for this. So after installing open your text editor and create a new file like in this video below.
After creating a new file, then give a location to your file and enter the file name, then save it. So now we start coding. First of all, I am going to show the syntax of CSS code. So let’s go
In the above image, there are three things. As you can see
Selectors are the HTML tags that we will select like (body tag, p tag, div tag, etc.) and Properties are the keywords to which we assign Values.
For Example, I assign a selector(like p tag) a property(like color) whose value is( red). Then, what will happen, let me show you, see in this video below
As you saw in the video, firstly I linked my HTML page to the CSS style sheet by adding a link tag in the HTML head tag. As shown below
<head> <link rel="stylesheet" href="filename.css> </head>
You must add this link tag in your HTML head section to link a CSS style sheet to your HTML page. So it will work properly. Otherwise, it will not work and CSS code does not do anything to the HTML page. Furthermore, after linking the style sheet to the HTML page it changed my page color.
So that’s how cascading style sheet works. We will further discuss CSS in our next lesson. About how we can link the cascading style sheet to the HTML page in three different ways.