Impostazioni predefinite di elementi HTML non riconosciuti

Question

Se si utilizzano elementi personalizzati o non supportati nel mio codice HTML, possono essere ancora stilizzati e il browser li renderà.

Ad esempio, l'elemento HTML5 main non è supportato da Internet Explorer 11 e versioni precedenti (source). Quando viene eseguito il rendering di main da IE, le regole CSS che includono margin e overflow vengono ignorate. Ciò implica che il valore display di un elemento non riconosciuto è inline.

Dove sono definite le impostazioni iniziali per un elemento non riconosciuto?

(NOTA: Non sto chiedendo circa i pro ei contro di utilizzare gli elementi personalizzati Voglio solo sapere cosa CSS fa per impostazione predefinita..)

Answer 1

Non è tanto non riconosciuti elementi, come tutto elementi. Ricorda che i CSS supportano sia XML che HTML. In XML, tutti gli elementi sono riconosciuti

Nel CSS 2.1 spec, section 6.1.1 dice:

6.1.1 valori riportati

agenti utente deve prima assegnare un valore specificato per ogni proprietà basato sui seguenti meccanismi (in ordine di precedenza):

1. Se la cascata produce un valore, usalo Tranne che, se il valore è 'inherit', il valore specificato è definito in "The 'inherit' value" di seguito.

2. In caso contrario, se la proprietà è ereditata e l'elemento non è la radice dell'albero del documento, utilizzare il valore calcolato dell'elemento genitore .

3. Altrimenti utilizzare il valore iniziale della proprietà. Il valore iniziale di ogni proprietà è indicato nella definizione della proprietà.

Per definizione, gli elementi non riconosciuti non sarà menzionato nel foglio di stile user agent, e dal momento che stiamo parlando del comportamento predefinito, non sarà menzionato nel foglio di stile dell'autore sia. Quindi 1 non si applica.

La proprietà di visualizzazione è definita in 9.2.4 The 'display' property. Nelle regole lì, dice Inherited: no, quindi 2 non si applica.

Quindi vale 3. Sempre dalle regole in 9.2.4, abbiamo Initial: inline, quindi gli elementi sono in linea.

Per gli elementi a livello di blocco HTML, sono bloccati per impostazione predefinita semplicemente perché sono elencati come tali nel foglio di stile del programma utente. Allo stesso modo per altri valori di visualizzazione come table, list-item ecc.