W3.CSS Colors
In W3.CSS, we don’t have to write own CSS code for styling, instead various classes are available for styling the webpage. We have to only include/link w3.css file in our web page and then have to use classes available for particular purpose. The rich sets of predefined classes are available in W3.CSS.
In terms of coloring of element, there are following classes in W3.CSS:
w3-color It is used to specify the background color of the element.
w3-text-color It is used to specify the text color
w3-hover-color It is used to specify background color when mouse is moved over the element.
w3-hover-text-color It is used to specify text color of the element when mouse is moved over the element.
Note: In above class name, color name is specified in place of color, like
w3-green, w3-red, w3-yellow etc.
w3-text-blue, w3-text-pink etc.
w3-hover-aqua, w3-hover-teal etc.
w3-hover-text-lime, w3-hover-text-sand etc
Example:
<!doctype html>
<html>
<head>
<title> INFOMAX </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>
<div class="w3-purple">
<h1 class="w3-green w3-text-yellow w3-hover-blue w3-hover-text-orange"> INFOMAX COMPUTER ACADEMY </h1>
<p> The Institute of Comnputer Programming </p>
</div>
<div class="w3-green">
<h1> ADDRESS </h1>
<p> G. R. Complex Preetam Nagar Dhoomanganj Prayagaraj </p>
</div>
</body>
</html>
- w3-hover-color
- w3.hover-color
- w3:hover-color
- w3-hovreable-color