|
|
CSS can be added to HTML documents in 3 ways:
The most common way to add CSS, is to keep the styles in external CSS files. However, in this tutorial we will use inline and internal styles, because this is easier to demonstrate, and easier for you to try it yourself. |
Example of using CSS under HTML Inline CSS Style
Inline - by using the style attribute inside HTML elements
index.html
Example:
HTML
<h1 style="color:blue;">A Blue Heading</h1>
<p style="color:red;">A red paragraph.</p>
Example of using CSS under HTML Internal CSS Style
Internal Style defines <style>body {background-color: powderblue;}</style> which you can add in a html page likely following example.
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: powderblue;}
h1 {color: blue;}
p {color: red;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Output should be:
Example of using CSS under HTML External CSS Style
External CSS defines <link rel="stylesheet" href="styles.css"> tag. Which can be used under href link .css file. Following is the best example.
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://itupto.com/style.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Output should be:
| What is HTML CSS | HTML CSS |
| How to use CSS | HTML CSS |
| How to use HTML Inline CSS | HTML CSS |
| How to use HTML Internal CSS | HTML CSS |
| How to use HTML External CSS | HTML CSS |
| How to create HTML CSS Colors, Fonts and Sizes | HTML CSS |
| Example of using CSS under HTML Inline CSS Style | HTML CSS |
| Example of using CSS under HTML Internal CSS Style | HTML CSS |
| Example of using CSS under HTML External CSS Style | HTML CSS |
Read Full: | HTML CSS |
Category: | Web Tutorial |
Sub Category: | HTML CSS |
Uploaded by: | Admin |
Views: | 78 |
Reffered: https://www.w3schools.com/html/html_css.asp