Negli esempi css, ho visto regole definite a partire da un . e alcune che iniziano con # - a volte queste sono mescolate nello stesso file. Qual è la differenza tra queste regole:Qual è la differenza tra. e # in un file css?
h1 { font-size:18pt;}
.new-alerts { font-size:11pt; font-weight:bold;}
#old-alerts { position:relative; font-size:10pt; }
Sono referenziati in modo diverso nella pagina html? È così che le proprietà vengono ereditate?
. fa riferimento a una classe. <span class="one" /> potrebbe essere selezionato con .one.
# fa riferimento a un ID. <span id="one" /> potrebbe essere selezionato con #one.
Dovresti utilizzare le classi quando potrebbero esserci più di un elemento e ID quando sai che ce ne sarà uno solo. #navigation-bar utilizza un ID perché nel layout è presente una sola barra di navigazione, ma .navigation-link utilizza un nome di classe perché saranno disponibili più collegamenti di spostamento. (Sarebbe meglio la pratica di utilizzare #navigation-bar a:link per ottenere i link di navigazione, ma si ottiene il mio punto.)
Che cosa significa? Come sono differenti? – George
Sono entrambi modi per aggiungere semanticamente informazioni a un elemento. Mentre puoi marcare solo un elemento con un particolare 'id', puoi avere molti con lo stesso' classe'. –
Si utilizzano ID per un tag specifico, è univoco e si dovrebbe avere solo uno degli stessi ID su una pagina. Le classi sono riutilizzabili e possono essere applicate a tutti gli elementi che vuoi. –
Il punto . è un class selector, l'hash/pound/cancelletto #selects by an ID:
<style>
.foo { ... }
#bar { ... }
</style>
...
<p class='foo'>Foo</p>
<p id='bar' class='baz'>Bar</p>
Gli ID devono essere unici in tutto un documento, le classi non devono essere. Questa è fondamentalmente la differenza principale. Ci sono alcune cose da notare per quanto riguarda lo scripting, ma di solito non sono di particolare interesse durante lo styling.
Inoltre, un elemento può appartenere a più classi:
<p class="foo bar baz">
e come visto sopra, classi e ID non si escludono.
. è una classe e può essere riutilizzata più volte e per elementi diversi
# è un ID e deve essere utilizzato solo una volta su ogni pagina.
Appartiene qui: http://doctype.com/ –
Non sono sicuro che lo faccia. Doctype sembra essere più di design, mentre si tratta della semantica del linguaggio stesso. – Matchu
@Jon: Non necessariamente ... * »Se la tua domanda riguarda il web design e il layout HTML/CSS, ** e il titolo del tuo lavoro è" designer ", ** chiedi su Doctype.« * - Non penso sia sbagliato qui – Joey