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.

Give it a Try!

Browser Support

The following table will show you the current browser support for the CSS type selector.

Desktop
Edge Chrome Firefox Opera Safari
YesYesYesYesYes
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview
YesYesYesYesYesYes