border-top

Resumen

La propiedad de CSS border-top es una abreviatura que establece los valores de border-top-color, border-top-style (en-US), y border-top-width (en-US). Estas propiedades las caracter铆sticas del borde superior de un elemento.

Los tres valores de la abreviatura pueden ser especificados en cualquier orden, y uno o dos de ellos pueden ser omitidos.

Como con todas las propiedades abreviadas, border-top siempre establece los valores de todas las propiedades que sean posibles, aun si no est谩n especificadas. Establece aquellas que no son especificadas a sus valores por defecto. Esto significa que:

  border-top: none thick green;

es lo mismo que

  border-top: thick green;

y el valor de border-top-style (en-US) establecido antes de border-top es ignorado.

El no especificar la parte de border-style que est谩 destinada a establecer el valor de border-top-style (en-US) significa que se tomar谩 el valor por defecto, lo que significa que el border-top-style (en-US) ser谩 none.

Tambi茅n hay que tomar en cuenta que en el siguiente bloque de c贸digo se ignorar谩 la primer asignaci贸n de border-top-style (en-US) dado que al indicar border-top se establecer谩 implicitamente el valor de border-top-style (en-US) a none

  border-top-style: dotted;
  border-top: thick green;
Valor inicialas each of the properties of the shorthand:
Applies toall elements. It also applies to ::first-letter.
Heredableno
Valor calculadoas each of the properties of the shorthand:
Animation typeas each of the properties of the shorthand:

Sintaxis

border-top: 1px;
border-top: 2px dotted;
border-top: medium dashed green;

Valores

<br-width> 
See border-top-width (en-US).
<br-style> 
See border-top-style (en-US).
<color> 
See border-top-color.

Sintaxis formal

<line-width> || (en-US) <line-style> || (en-US) <color>

where
<line-width> = <length> | (en-US) thin | (en-US) medium | (en-US) thick
<line-style> = none | (en-US) hidden | (en-US) dotted | (en-US) dashed | (en-US) solid | (en-US) double | (en-US) groove | (en-US) ridge | (en-US) inset | (en-US) outset
<color> = <rgb()> | (en-US) <rgba()> | (en-US) <hsl()> | (en-US) <hsla()> | (en-US) <hex-color> | (en-US) <named-color> | (en-US) currentcolor | (en-US) <deprecated-system-color>

where
<rgb()> = rgb( <percentage>{ (en-US)3} (en-US) [ (en-US) / <alpha-value> ] (en-US)? (en-US) ) | (en-US) rgb( <number>{ (en-US)3} (en-US) [ (en-US) / <alpha-value> ] (en-US)? (en-US) ) | (en-US) rgb( <percentage># (en-US){ (en-US)3} (en-US) , <alpha-value>? (en-US) ) | (en-US) rgb( <number># (en-US){ (en-US)3} (en-US) , <alpha-value>? (en-US) )
<rgba()> = rgba( <percentage>{ (en-US)3} (en-US) [ (en-US) / <alpha-value> ] (en-US)? (en-US) ) | (en-US) rgba( <number>{ (en-US)3} (en-US) [ (en-US) / <alpha-value> ] (en-US)? (en-US) ) | (en-US) rgba( <percentage># (en-US){ (en-US)3} (en-US) , <alpha-value>? (en-US) ) | (en-US) rgba( <number># (en-US){ (en-US)3} (en-US) , <alpha-value>? (en-US) )
<hsl()> = hsl( <hue> <percentage> <percentage> [ (en-US) / <alpha-value> ] (en-US)? (en-US) ) | (en-US) hsl( <hue>, <percentage>, <percentage>, <alpha-value>? (en-US) )
<hsla()> = hsla( <hue> <percentage> <percentage> [ (en-US) / <alpha-value> ] (en-US)? (en-US) ) | (en-US) hsla( <hue>, <percentage>, <percentage>, <alpha-value>? (en-US) )

where
<alpha-value> = <number> | (en-US) <percentage>
<hue> = <number> | (en-US) <angle>

Ejemplos

element {
    border-top: 1px solid #000;
}

Especificaciones

Especificaci贸n Status Comentarios
CSS Backgrounds and Borders Module Level 3
La definici贸n de 'border-top' en esta especificaci贸n.
Candidate Recommendation

No hay cambios directos, aunque la modificaci贸n de valores para border-top-color s铆 aplican.

CSS Level 2 (Revision 1)
La definici贸n de 'border-top' en esta especificaci贸n.
Recommendation No hay cambios significativos
CSS Level 1
La definici贸n de 'border-top' en esta especificaci贸n.
Recommendation Definici贸n inicial

Compatibilidad con navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)
Caracter铆stica Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Soporte b谩sico 1.0 1.0 (1.7 o anterior) 4 3.5 1.0 (85)
Caracter铆stica Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Soporte b谩sico 1.0 1.0 (1.0) (Yes) (Yes) (Yes)