Scribd
Upload
37 views

Type Selectors - CSS - Cascading Style Sheets - MDN

Type selectors in CSS match elements by their node name. They select all elements of a given type within a document. Type selectors can be namespaced to match elements within specific namespaces. The syntax is an element name between curly brackets with style properties. Examples show a span and paragraph styled with background colors. Namespaces allow selecting h1 elements within a specified namespace like an example namespace. Browser support details are provided.

Uploaded by

Daniel Alfonso
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
37 views

Type Selectors - CSS - Cascading Style Sheets - MDN

Type selectors in CSS match elements by their node name. They select all elements of a given type within a document. Type selectors can be namespaced to match elements within specific namespaces. The syntax is an element name between curly brackets with style properties. Examples show a span and paragraph styled with background colors. Namespaces allow selecting h1 elements within a specified namespace like an example namespace. Browser support details are provided.

Uploaded by

Daniel Alfonso
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Type selectors

The CSS type selector matches elements by node name. In other words, it selects all elements of the given type within a document.
/* All <a> elements. */

a {

color: red;

Type selectors can 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 that mixes multiple vocabularies.
ns|h1 - matches <h1> elements in namespace ns
*|h1 - matches all <h1> elements

|h1 - matches all <h1> elements without any declared namespace

Syntax
element { style properties }

Examples
CSS
span {

background-color: skyblue;

HTML
<span>Here's a span with some text.</span>

<p>Here's a p with some text.</p>

<span>Here's a span with more text.</span>

Result
Here's a span with some text.

Here's a p with some text.

Here's a span with more text.

Namespaces
In this example the selector will only match <h1> elements in the example namespace.
@namespace example url(http://www.example.com);

example|h1 {

color: blue;

Specifications
Specification
Selectors Level 4
# type-selectors

Browser compatibility
Report problems with this compatibility data on GitHub

diordnA rof xoferiF


diordnA emorhC

diordnA arepO
emorhC

xoferiF

arepO

irafaS
egdE

Type selector Chrome 1 Edge 12 Firefox 1 Opera 3.5 Safari 1 Chrome 18 Firefox 4 Opera 10.1
( elementName ) Android for Android
Android
Namespaces Chrome 1 Edge 12 Firefox 1 Opera 8 Safari 1.3 Chrome 18 Firefox 4 Opera 10.1
( ns|elementName ) Android for Android
Android
Tip: you can click/tap on a cell for more information.
Full support

See also
CSS Selectors
Learn CSS: Selectors

Last modified: Sep 29, 2022, by MDN contributors

You might also like