What is CSS?

By | August 20, 2019

In front-end development, we have three major tools in use HTML, CSS, and JavaScript. HTML gives a structure to a web page, CSS color, and style that web page and JavaScript put some logic on that webpage.

Before the introduction of CSS web pages were like a black and white text on the internet, CSS gave styling and add color to those web pages.

Here in this article, we have provided a simple explanation of What is CSS? and why do we use it?

What is CSS?

CSS stands for Cascading Style Sheets which is used to style different web pages which includes design, layout, and variations in the display. It is developed by W3C World Wide Web Consortium so it could solve the problem with the HTML individual line styling.

Everything that we see on a webpage with color and layout is because of CSS and its Framework. Now more than using a direct CSS code we use its frameworks because they are able to adjust the web-page layout and design according to the devise size.

With regular updates, CSS has gained a lot in past years now instead of calling it CSS developers prefer it as CSS4 and it contains many updates and new terms.

Type of CSS?

CSS is divided into three types on the basis of how it is introduced in an HTML file.

  • Inline CSS
  • Internal or Embedded CSS
  • External CSS

Inline CSS:

In Inline CSS, the CSS property is directly assigned along with the HTML tag using the style attribute.

Inline CSS syntax:

<p style = "color:#001200; font-size:40px;
text-align:left;">
Techgeekbuzz
</p>

Internal or Embedded CSS:

In Internal or Embedded CSS, the HTML file itself contains a unique and single style tag. The style tag in an HTML tag can affect all tag inside that HTML file.

Internal or Embedded CSS Syntax:

<!DOCTYPE html>
<html>
<head>
<title>Internal CSS</title>
<style>     </style>
</head>
<body>     </body>
</html>

External CSS:

In External CSS we create a separate CSS file using .css extension. To link the external CSS file in our HTML page we use the html <link> tag.

External CSS extension:

<link rel="stylesheet" href="tech.css"/>

Why use CSS?

The only reason for CSS, to provide a proper interface and layout to the skeleton looking HTML pages. With some new update, CSS is able to perform some of the JavaScript Task.

Even before the introduction of CSS HTML tags possesses some styling tools, the only problem was developer have to visit each tag in order to provide the styling to that particular tag.

Syntax of pre-CSS HTML:

<h1><font color="blue"> Heading 1 
</font></h1>

CSS Peculiarities

Here some major features of CSS:

  • HTML Individual line Problem: Before CSS developer had to visit every single line in order to style that particular tag, this was so time-consuming and tedious.
  • Save Time: It saves a lot of time, by using a single style tag we can style all the similar tag of an HTML page.
  • Load page fast: With the introduction of CSS, it replaces the HTML tag individual styling and reduces the number of style attributes associated with each tag this make web to load an HTML file much faster.
  • Device compatibility: Now CSS and its frameworks use to style HTML pages it adjusts the page layout according to the device size.

People Also Read:

Leave a Reply

Your email address will not be published. Required fields are marked *