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

CSS selectors

 

Universal Selector

CSS universal selectors select any type of elements in an HTML page. It matches a single element. An asterisk ( i.e. "*" ) is used to denote a CSS universal selector. An asterisk can also be followed by a selector. This is useful when you want to set a style for of all the elements of an HTML page or for all of the elements within an element of an HTML page.

syntax:

* { CSS-Property: value; ........................ } 

Simple Example of CSS universal selectors

CSS code:

* {
color: blue; /* color of all the elements should be blue */
background: silver; /* silver background is set for all the elements */
}

HTML code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Simple Example of CSS universal selectors </title>
<link rel='stylesheet' href='simple-example-of-CSS-universal-selectors.css' type='text/css'>
</head>
<body>
<h1>Example of CSS.</h2>
<h2>Example of grouping of CSS universal selectors.</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a urna elit. Integer malesuada tempus enim nec rhoncus.</p>
</body>
</html>

Result:

example simple css universal selector

View this simple example of CSS universal selector in a separate browser window.

CSS code:

*[lang=fr]{color:blue;}  /* sets color blue  */

HTML code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Advanced Example of CSS universal selectors</title>
<link rel='stylesheet' href='advanced-example-of-CSS-universal-selectors.css' type='text/css'>
</head>
<body>
<p>This paragraph is in english.</p>
<p lang="fr">Ce paragraphe est en français.</p>
</body>
</html>

Result:

This paragraph is in english.

Ce paragraphe est en français.

 

View this advanced example of CSS universal selector in a separate browser window.

Previous: Grouping of CSS selectors
Next: CSS type selectors