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.

Nota: 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:

css

border-top: none thick green;

es lo mismo que

css

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

css

border-top-style: dotted;
border-top: thick green;

Valor inicial	as each of the properties of the shorthand: `border-top-width` (en-US): `medium` `border-top-style` (en-US): `none` `border-top-color`: `currentcolor`
Applies to	all elements. It also applies to `::first-letter`.
Heredable	no
Valor calculado	as each of the properties of the shorthand: `border-top-width` (en-US): the absolute length or `0` if `border-top-style` (en-US) is `none` or `hidden` `border-top-style` (en-US): como se especifica `border-top-color`: computed color
Animation type	as each of the properties of the shorthand: `border-top-color`: a color `border-top-style` (en-US): discrete `border-top-width` (en-US): a length

Sintaxis

css

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

border-top = 
  <line-width>  ||
  <line-style>  ||
  <color>       

<line-width> = 
  <length [0,∞]>  |
  thin            |
  medium          |
  thick           

<line-style> = 
  none    |
  hidden  |
  dotted  |
  dashed  |
  solid   |
  double  |
  groove  |
  ridge   |
  inset   |
  outset

Ejemplos

css

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

Especificaciones

Specification
CSS Backgrounds and Borders Module Level 3 # border-shorthands

Compatibilidad con navegadores

BCD tables only load in the browser