.red-text{
color: red;
}
</style>
<h2 class="red-text">CatPhotoApp
</h2>
<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
Your browser information:
Your Browser User Agent is: Mozilla/5.0 (Linux; Android 5.1; HTC Desire 828 dual sim Build/LMY47D) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.109 Mobile Safari/537.36.
<style>
.red-text{
color: red;
}
</style>
<h2 class="red-text">CatPhotoApp
</h2>
<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
You welcome!
There is two ways to use CSS in html. The one we already used now , i.e. including css elements in style tag in the head tag of html. The other one we create a new css file and link this file with the html file. see this example:
External CSS
An external style sheet is used to define the style for many HTML pages.
With an external style sheet, you can change the look of an entire web site, by changing one file!
To use an external style sheet, add a link to it in the <head> section of the HTML page:
Example
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
An external style sheet can be written in any text editor. The file must not contain any HTML code, and must be saved with a .css extension.
Here is how the "styles.css" looks:
body {
background-color: powderblue;
}
h1 {
color: blue;
}
p {
color: red;
}