HTML class Attribute

Esempio

Utilizzare della class di attributo in un documento 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>

Prova tu stesso "

Più "Provate voi stessi" esempi di seguito.

Definizione e utilizzo

La class attributo specifica una o più classnames per un elemento.

La class attributo è in gran parte utilizzato per puntare a una classe in un foglio di stile. Tuttavia, può essere utilizzato anche da un JavaScript (tramite il DOM HTML) per apportare modifiche agli elementi HTML con una classe specificata.

Supporto per il browser

Attributo
class	sì	sì	sì	sì	sì

Differenze tra HTML 4.01 e HTML5

In HTML5, la class attributo può essere utilizzato suqualsiasi elemento HTML (sarà convalidare su un elemento HTML. Tuttavia, non è necessariamente utile).

In HTML 4.01, la class attributo non può essere utilizzato con: <base>, <head>, <html>, <meta>, <param>, <script>, <style> e <title> .

Sintassi

<elementclass="classname">

I valori degli attributi

Valore	Descrizione
classname	Specifica uno o più nomi di classe per un elemento. Per specificare più classi, separare i nomi delle classi con uno spazio, ad esempio <span class="left important"> . Ciò consente di combinare diverse classi CSS per un elemento HTML. Regole di denominazione: Deve iniziare con una lettera AZ o az Può essere seguito da: lettere (A-Za-z) , cifre (0-9) , trattini ("-") , e underscore ("_") In HTML, tutti i valori sono case-insensitive

Valore

Descrizione

classname

Specifica uno o più nomi di classe per un elemento. Per specificare più classi, separare i nomi delle classi con uno spazio, ad esempio <span class="left important"> . Ciò consente di combinare diverse classi CSS per un elemento HTML.

Regole di denominazione:

Deve iniziare con una lettera AZ o az
Può essere seguito da: lettere (A-Za-z) , cifre (0-9) , trattini ("-") , e underscore ("_")
In HTML, tutti i valori sono case-insensitive

Altri esempi

Esempio

Aggiungere più classi di un elemento 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>

Prova tu stesso "