CSS Type Selector
Description
The CSS type selector is the simplest type of CSS selector. It selects all elements of a given type within a document. To use a type selector, simply write the name of the element you want to select. For example, the selector p
will select all paragraph elements in a document.
Type selectors can be used to select any type of HTML element, including headings, paragraphs, lists, images, and more. They can also be used to select elements from within a specific namespace. For example, the selector @namespace example url(http://www.example.com); example|h1
will select all h1
elements in the example
namespace.
Here are some examples of CSS type selectors:
/* Selects all paragraph elements */
p {
color: blue;
}
/* Selects all heading elements */
h1, h2, h3, h4, h5, h6 {
font-size: 20px;
}
/* Selects all image elements */
img {
width: 100px;
}
/* Selects all `h1` elements in the `example` namespace */
@namespace example url(http://www.example.com);
example|h1 {
color: red;
}
Type selectors are a very useful tool for CSS styling. They can be used to select any element on a page and apply CSS properties to it. This makes it easy to style your web pages in a consistent and efficient way.
Syntax
element { css declarations; }
Example
span {
color: #3366ff;
background: #ffff99;
}
Give it a Try
Click the button below to experiment with this selector.
Browser Support
The following table will show you the current browser support for the CSS type
selector.
Desktop | |||||
![]() |
![]() |
![]() |
![]() |
![]() |
|
Yes | Yes | Yes | Yes | Yes |
Tablets / Mobile | |||||
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Yes | Yes | Yes | Yes | Yes | Yes |