CSS in HTML
CSS in HTML:
The abbreviation of CSS in cascading style sheet. Without CSS HTML doc is just like women without makeup. It gives a powerful decorating feature which enables to design the page more effectively and easily.
It is generally used to format the layout of the webpage. CSS gives you the power to control the font, color, and the size between elements and deals with the stuff of how elements are centered, what is a background image, its color, etc.
Here the word cascading is related to the hierarchy parent to child relationship, if you marked the background as Red then everything inside the tag and subtag will be colored as Red.
Types of tag:
1. Inline CSS
Here in this type of CSS is also called a tag level style sheet. In inline CSS you have to use style as an attribute as HTML elements.
With the help of an example, you will understand more briefly.
Example:
<!DOCTYPE html>
<html>
<body>
<h1 style="color:black;">Ramesh is on the way</h1>
<p style="color:black;">How are you geeta?</p>
</body>
</html>2. Internal CSS
In this style sheet, you have to use the Style tag in the head section to define the properties of the tag.
Internal CSS is completely acted to define the style in a single page of HTML.
Example:
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: red;}
h1 {color: yellow;}
p {color: white;}
</style>
</head>
<body>
<h1>This is heading in html</h1>
<p>You have to write the paragraph.</p>
</body>
</html>3. External CSS
By the world external only it’s defined that something which is mapped to outside of the file. Here in external CSS, you have to define the properties of the tag outside of the HTML file, and you have to link that file using the <link> tag in the webpage.
Example:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Goodmorning guys</h1>
<p>Hello everyone.</p>
</body>
</html>