Please note, this is a STATIC archive of website technosmarter.com from July 2022, cach3.com does not collect or store any user information, there is no "phishing" involved.
 
  1. Techno

How to use CSS in HTML | Link CSS


CSS is known as a cascading stylesheet that is used to design a webpage. Every HTML page includes CSS to design the contents. There are three types of CSS using an HTML page .
1. Inline CSS

2. Internal CSS

3. External CSS



It is very easy to include CSS in the HTML document. There is a designing part of the website that is done by CSS. There are three types of using CSS in HTML. In simple words, if you want to include CSS in HTML then you can do three ways.

The first way you can use internal CSS. You can do it by just creating the CSS in the head and use in the HTML page.

What is Inline CSS

Inline CSS is the way of using CSS in one line . The name indicates (inline) --in one line . In simple words if you have needed to use CSS in one line or paragraph then you can specify the CSS with one DIV or one HTML tag .

The following example of inline CSS will show you the main purpose of Inline CSS.


Inline CSS 


<!DOCTYPE html>
<html>
<head>
<title>Inline CSS in HTML   </title>
</head>

 
Please note, this is a STATIC archive of website technosmarter.com from July 2022, cach3.com does not collect or store any user information, there is no "phishing" involved.




Welcome to our Website


This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.



</body>
</html>

What is Internal CSS

Internal CSS refers to on the page page that means we create a CSS inside the head div and use it by calling the class and id . Its is very simple to create and use in one HTML page .

The following example of inline CSS will show you the main purpose of Internal CSS.


CSS in HTML


<!DOCTYPE html>
<html>
<head>
<title>Internal CSS in HTML   </title>

</head>

 
Please note, this is a STATIC archive of website technosmarter.com from July 2022, cach3.com does not collect or store any user information, there is no "phishing" involved.




Welcome to our Website


This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.



</body>
</html>
Run

What is External CSS

The second way: In the second type of including the CSS in HTML from the external source file . To include, you have to create an HTML file and CSS file then include the CSS file in HTML file via the link .

The following example of inline CSS will show you the main purpose of External CSS.



First of all you need to create a HTML file .

myfile.html


<!DOCTYPE html>
<html>
<head>
<title>Internal CSS in HTML   </title>

</head>

 
Please note, this is a STATIC archive of website technosmarter.com from July 2022, cach3.com does not collect or store any user information, there is no "phishing" involved.




Welcome to our Website


This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.



</body>
</html>
Run

In the above example, we have created an HTML page and use the stylesheet link to link the CSS file. When you link the CSS file with the HTML page it includes all attributes the effect on HTML pages.
CSS LINKED to HTML via -


myfile.css is another CSS file.

Now you have to create the CSS file.


myfile.css



.header{
height:100px;
width:400px;
background-color:grey;
color:white;
}
p{
color:red;
}

Please Share

Recommended Posts:-