English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'attributo border-top-style CSS imposta lo stile del margine superiore dell'elemento. Tuttavia, in molti casi, comeborder-styleoppureborder-topQuesti attributi CSS abbreviati sono più facili da utilizzare e più preferibili.
La tabella seguente fornisce una descrizione dell'uso e la cronologia delle versioni di questa proprietà, nonché la sintassi dell'uso di questo attributo nel linguaggio JavaScript.
| Valore predefinito: | nessuno |
|---|---|
| Applicabile a: | Tutti gli elementi |
| Ereditarietà: | No |
| Animabile: | No.Vedere anche Attributi animazione. |
| Versione: | CSS 1, 2, 3 |
| Sintassi JavaScript: | oggetto.style.borderTopStyle="tratteggiato" |
La sintassi di questo attributo è la seguente:
border-top-style: nessuno | nascosto | punteggiato | tratteggiato | solido | doppiato | groove | ridge | inset | outset | ereditato
L'esempio seguente dimostra come utilizzare l'attributo border-top-style.
p {
border-top-style: tratteggiato;
border-top-width: 3px;
}Testa e vediamo‹/›La tabella seguente descrive i valori di questa proprietà.
| Valore | Descrizione |
|---|---|
| nessuno | Non ci sono margini visibili. |
| hidden | Con lo stesso none, la differenza è che le celle della tabella hannoBordo ripiegatoE le due celle condividono il bordo. Il valore hidden assicura che il bordo non venga disegnato, perché hidden ha la precedenza su tutti gli altri stili di bordo. |
| dotted | Mostra il bordo come una serie di punti. |
| dashed | Mostra il bordo come una serie di segmenti corti, ossia trattini. |
| solid | Mostra il bordo come una linea continua. |
| double | Mostra il bordo come due linee parallele con un intervallo tra loro. La somma delle due linee e l'intervallo tra loro è uguale aborder-widthdel valore. |
| groove | Mostra un bordo inciso nella tela. Ha un impatto 3D, questo è spesso realizzato usando un colore più chiaro del colore del bordo.border-colorCreato da due colori più chiari e più scuri per creare l'ombra. |
| ridge | Mostra un bordo groove che ha l'effetto opposto. Ha anche un impatto 3D, il bordo sembra venire fuori dalla tela. |
| inset | Mostra un bordo che fa sembrare l'elemento come se fosse inserito nella tela. Ha un impatto 3D, questo è spesso realizzato creando un'ombra con due colori, più scuri del colore del bordo.border-colorSfumato e più scuro. |
| outset | Mostra un bordo inset che ha l'effetto opposto. Ha anche un impatto 3D, il bordo fa sembrare la scatola come se fosse uscita dallo schermo. |
| initial | Imposta questa proprietà al suo valore predefinito. |
| inherit | Se specificato, l'elemento correlato adotta il valore della proprietà border-top-style dell'elemento genitore. |
Compatibilità del browser per proprietà border-top-style, i numeri nella tabella sottostante rappresentano la versione minima del browser che supporta la proprietà; tutti i browser mainstream supportano questa proprietà.
|
Attenzione: Internet Explorer 7 e versioni precedenti non supportano value hidden. IE8 supporta, ma richiede un<!DOCTYPE>.IE9 e versioni successive supportano il valore hidden.
Vedere la guida:CSS Border,CSS3 Border.
Proprietà correlate:border,border-style,border-top,border-top-color,
border-top-width.