W3Schools
w3schools.com › cssref › sel_all.php
CSS Universal (*) Selector
accent-color align-content align-items ... white-space widows width word-break word-spacing word-wrap writing-mode z-index zoom ... More "Try it Yourself" examples below. The CSS universal selector (*) selects all elements of any type....
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › CSS › Reference › Selectors › Universal_selectors
Universal selectors - CSS - MDN - Mozilla
November 17, 2025 - The CSS universal selector (*) matches elements of any type. ... The universal selector is a special type selector and can therefore be namespaced when using @namespace. This is useful when dealing with documents containing multiple namespaces such as HTML with inline SVG or MathML, or XML ...
Videos
Unleash the Power of the Universal Selector in CSS | #css - YouTube
Universal - CSS Class Selector ! - YouTube
06:11
CSS Universal Selector What is it and why does it matter? - YouTube
07:15
CSS Tutorial For Beginners 26 - The Universal Selector - YouTube
The Power of the Universal Selector in CSS - Discover how ...
08:51
CSS Tutorial for beginners in Hindi #5 | ID, Element, Universal ...
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › CSS › Universal_selectors
Universal selectors - CSS - MDN Web Docs
August 5, 2025 - The CSS universal selector (*) matches elements of any type. ... The universal selector is a special type selector and can therefore be namespaced when using @namespace. This is useful when dealing with documents containing multiple namespaces such as HTML with inline SVG or MathML, or XML ...
GeeksforGeeks
geeksforgeeks.org › css › what-is-the-universal-selector
What is the Universal Selector? - GeeksforGeeks
July 23, 2025 - Wildcard Selection: The universal selector selects all HTML elements within its scope. Global Styling: It's commonly used for global styling resets, normalizing default styles, or applying consistent box-sizing. Specificity Considerations: While powerful, the universal selector should be used judiciously to avoid unintended consequences or conflicts with more specific selectors.
DEV Community
dev.to › clairecodes › my-misconceptions-about-the-universal-selector-in-css-4ngm
My Misconceptions about the Universal Selector in CSS - DEV Community
April 21, 2019 - Yes, but I was more commenting on how '*' doesn't apply to everything since it doesn't pierce shadow-roots. ie 'Universal' itself, is sort of a misconception. It is sort of obvious, but it's worth pointing out, maybe. ... But that actually depends: many CSS properties are inherited from the host node into the shadow DOM, if not overwritten in the shadow DOMs style. So in many cases '*' will apply to everything, though it will not select everything. E.g. querySelectorAll will not return stuff from document fragments, but a CSS rule with that selector may still apply to stuff in the fragments through inheriting.
meyerweb
meyerweb.com › eric › articles › webrev › 200006a.html
Universal Selector
In many ways, the most powerful of the new CSS2 selectors is the universal selector. The universal selector can be used to represent any element at all, and is specified using an asterisk (*).
CSS-Tricks
css-tricks.com › almanac › selectors › u › universal
Universal | CSS-Tricks
June 20, 2024 - The Universal Selector is the * in CSS. Literally the asterisk character. It is essentially a type selector that matches any type. Type meaning an HTML tag like
TutorialsPoint
tutorialspoint.com › universal-selector-in-css
Universal Selector in CSS
January 2, 2024 - The CSS * selector is a universal selector which is used to select all elements of the HTML DOM. If you want to set a similar style for the entire document, then use the Universal selector. Syntax The syntax for CSS universal selector is as follows:
MDN Web Docs
developer.mozilla.org › en-US › docs › Learn_web_development › Core › Styling_basics › Basic_selectors
Basic CSS selectors - Learn web development | MDN
In the following example, the invalid class selector rule will be ignored, whereas the h1 would still be styled. ... When combined, however, neither the h1 nor the class will be styled as the entire rule is deemed invalid. ... The universal selector is indicated by an asterisk (*).
SitePoint
sitepoint.com › blog › html & css › universal selector (css selector)
Universal Selector (CSS Selector) — SitePoint
March 1, 2024 - The universal selector in CSS is represented by an asterisk (*) and it matches any element in the document. This is different from other selectors like class selectors, id selectors, or element selectors that only match specific elements based on their class, id, or element type.
W3Resource
w3resource.com › css › selectors › CSS-universal-selector.php
CSS universal selectors - CSS tutorials - w3resource
August 19, 2022 - CSS universal selectors select any type of elements in an HTML page. It matches a single element.
Scaler
scaler.com › topics › universal-selector-in-css
What is a Universal Selector in CSS? - Scaler Topics
August 1, 2022 - There are several different types of selectors in CSS- ... As the name suggests, Universal Selector in CSS is used to select all the elements on the HTML page, such as <p>, <h1>, <img> etc.
Codedamn
codedamn.com › news › frontend
What is a universal selector in CSS?
November 9, 2022 - There are different selectors in CSS that allow us to select one or more than one HTML element at a time but what makes universal selectors different from all other selectors is their ability to select all the HTML elements of our page altogether.
freeCodeCamp
forum.freecodecamp.org › html-css
Universal selector and body selector rules - HTML-CSS - The freeCodeCamp Forum
October 11, 2020 - Hello everyone, I got a question. I realize that with the universal selector we simply select every single element on a page e.g.: * { margin: 0; padding: 0; box-sizing: border-box; } and with the body selector we will allow inheritance of things such as the font family, etc. e.g.: body { line-height; 1.6; font-weight: 400; font-family: 'Open Sans, san-serif; color: #555; } However, can you also use the body selector like this? body { font-family: ‘Open Sans’, sans-serif; margin: 0; pad...
W3Schools
w3schools.in › css3 › universal-selector
CSS Universal Selector - W3Schools
Universal selector provided by CSS helps in choosing any elements within the HTML page. It goes with a single element and uses the asterisk (i.e., "*") symbol used for denoting the selector as a universal selector.
Top answer 1 of 4
8
* wildcard is for all elements in page, doesn't matter what tag, classname, id or attribute it have.
html is only for <html> element.
Examples:
* {
color:red;
}
div {
color: green;
}<p>this is red</p>
<p>this is red</p>
<div>this is red but styling specifically to green</div>
<p>this is red</p> 2 of 4
4
The obvious answer is that simply using the * {} wilcard selects all elements on the page (even including the html element and any other element whether they had a class, id or not).
Using the html tag as a selector simply targets the html tag.
The * wildcard is very useful in that you can also use it to target ALL children of other elements, ie:
.parent > * {
color: red;
}
The above means that any DIRECT descendant of .parent will have a font color of red. Similary, you can do .parent * {} to target all descendants of .parent, whether they're directly below, or a few levels below.
Quora
quora.com › What-is-universal-selector-in-CSS
What is universal selector in CSS? - Quora
Answer (1 of 2): An asterisk ([code ]*[/code]) is the universal selector for CSS. It matches a single element of any type. * *|* - matches all elements * |* - matches all elements without any declared namespace Example : *.warning { color:red; ...
Top answer 1 of 5
5
I wrote up this little example. codepen.io example (http://codepen.io/donniereese/pen/mygQJm)
It's about inheritance vs. selection.
When you choose something like:
css
body {
font-family: Verdana;
}
This is inheritance. It follows flows down. Each child inherits the properties of it's parent. It doesn't create new instances of the different definitions in the selector.
If you added this:
```css
* {
font-family: Arial;
}
body {
font-family: Verdana;
}
```
You would think that, because body comes after the '*', it would would override the previous selector. It doesn't, though.
What is happening is that actual definitions definitions override inheritance. The '*' appears to actually act as though it creates a new selector for each element. Just like applying inline styles in the actually element would override any stylesheet. That is what I gather, at least.
2 of 5
1
In that case, would you get the same result by using:
body{
box-sizing: border-box;
}
??
LinkedIn
linkedin.com › learning › css-essential-training-22688362 › type-and-universal-selectors
Type and universal selectors - CSS Video Tutorial | LinkedIn Learning, formerly Lynda.com
For example, to apply a style to all the h2 elements on your webpage, use h2 as the selector. The universal selector can be used to select every single element in the whole document.
Published August 9, 2023
Top answer 1 of 3
2
This issue with the universal selector is that you are going to remove some potentially useful browser defaults on some elements, just to have to explicitly add them back at a later time.
In other words, a user is going to have to download a CSS style to put back padding or margin on an element that already had perfectly acceptable padding or margin without any download.
If you are looking to make elements render the same across all browsers, I would suggest you check out normalize.css, which tries to keep as many browser defaults in place as it can.
2 of 3
2
The universal selector is good for troubleshooting. If absolutely stumped on elements that are causing overflow issues I'll do * {border:1px solid pink}. Be sure to remove once troubleshooting is complete.