Przykład
Korzystanie z class atrybutu w dokumencie HTML:
<html>
<head>
<style>
h1.intro {
color: blue;
}
p.important {
color: green;
}
</style>
</head>
<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph. :)</p>
</body>
</html>
Spróbuj sam " Więcej "Try it yourself" przykłady poniżej.
Definicja i Wykorzystanie
class atrybut określa jeden lub więcej classnames dla elementu.
class atrybut jest stosowany głównie do punktu do klasy w arkuszu stylów. Jednakże, może być również używany przez JavaScript (poprzez DOM HTML), aby wprowadzić zmiany do elementów HTML z określonej klasy.
Pomoc Browser
Atrybut | |||||
---|---|---|---|---|---|
class | tak | tak | tak | tak | tak |
Różnice między HTML 4.01 i HTML5
W HTML5, class atrybutów można stosować wdowolnych elementów (to potwierdzić na elemencie HTML. Jednakże nie zawsze jest użyteczny).
W HTML 4.01, The class atrybut nie może być stosowany z: <base>, <head>, <html>, <meta>, <param>, <script>, <style> i <title> .
Składnia
<elementclass="classname">
wartości atrybutów
Wartość | Opis |
---|---|
classname | Określa jedną lub więcej nazw klas dla danego elementu. Aby określić wiele klas, należy oddzielić nazwy klas z przestrzeni, na przykład <span class="left important"> . W ten sposób można połączyć kilka klas CSS dla jednego elementu HTML. Reguły nazewnictwa:
|
Więcej przykładów
Przykład
Dodaj wiele klas do jednego elementu HTML:
<!DOCTYPE html>
<html>
<head>
<style>
h1.intro {
color: blue;
text-align: center;
}
.important {
background-color: yellow;
}
</style>
</head>
<body>
<h1 class="intro
important">Header 1</h1>
<p>A paragraph.</p>
</body>
</html>
Spróbuj sam " Podobne strony
Kurs HTML: Atrybuty HTML
CSS: CSS selektory
CSS: CSS .class Selector
HTML DOM: HTML DOM getElementsByClassName() Metoda
HTML DOM: HTML DOM className nieruchomości
HTML DOM: HTML DOM classList nieruchomości
HTML DOM: HTML DOM Style obiektu