FANDOM


CSS selectors are used to declare which of the markup elements a style applies to, a kind of match expression. Selectors may apply to all elements of a specific type, or only those elements that match a certain attribute; elements may be matched depending on how they are placed relative to each other in the markup code, or on how they are nested within the document object model.

Common selectors are the id selectors which use a hash sign to indicate the id, class selectors which use a period to indicate the class, and type selectors which use the node name of an element to indicate the type. There are also Universal CSS Selectors.

Pseudo-classes and pseudo-elements are also CSS selectors.


Examples:

ID selectors...
<style type="text/css">
#id {
     color:red;
}

p#1 {
     color:blue;
}
</style>
</head>
<body>
<span id="id">Red text.</span>
<p id="1">Blue text.</p>
Class selectors...
<style type="text/css">
.class {
        color:green;
}

p.1 {
     color:yellow;
}

.2 {
    background-color:black;
}
</style>
</head>
<body>
<span class="class 2">Green text on black bg.</span>
<p class="1">Yellow text.</p>
<span class="2">Text on black bg.</span>
<span class="class">Green text.</span>
Type selectors...
<style type="text/css">
p {
   color:red;
}

span,
div {
     color:green;
}
</style>
</head>
<body>
<p>Red text.</p>
<span>Green text.</span>
<div>Green text.</div>

See Also

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.