Hey Friends, from here we are going to start our new tutorial series about CSS. In this tutorial, we are going to cover complete CSS versions of CSS1, CSS2, CSS3 and gives you a complete understanding of CSS from the basics to advance. So let’s begin...
Introduction to CSS
CSS Stands for Cascading Style Sheet. It is used to style the web pages of the websites. It handles the look of Html documents. By applying CSS in your Html documents you can change the font of your web pages, color, alignment, style, background color, etc. a lot of things can be changed or style. CSS is easy to learn and understand. CSS is combined with other markup languages such as Html, XHTML, etc. to make web pages more attractive and beautiful.
Why we should learn CSS?
CSS played an important role in web development. It is necessary to implement CSS Code in your Html file. It increases the standard of your website. Users easily interact with your site. You can’t build a website without CSS. CSS makes the website more attractive and more beautiful. So if you have to become a web developer then you should have to learn CSS:-
Basic of web development: - Two basic skills that every web developer should have 1. Html 2. CSS. If you find a career in web development then you should have some knowledge about those two things.
Creating a stunning website: - Without CSS no one can create an attractive website. If you want to create a stunning website you need to apply CSS to it.
Increase the user attraction: - A simple and attractive UI website would help the users to visit your website again and again.
Example of a html webpage with or without CSS
Without CSS
<html>
<head>
<title> Example of CSS </title>
<body>
<h1> This is a Heading </h1>
<p> This is an Example of html documents.
</body>
</html>
Output :-
With CSS
<html>
<head>
<title> Example of CSS </title>
<style>
h1{ background-color: yellow;
color: red; }
p{ background-color: tomato;
color: green; }
</style>
<body>
<h1> This is a Heading </h1>
<p> This is an Example of html documents.
</body>
</html>
Output:-