border-right

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

La propiedad CSS border-right es un a propiedad rápida para dar valores al border-right-width, border-right-style y border-right-color. Estas propiedades establecen un bordederecho del elemento.

Pruébalo

Como con todas las propiedades rápidas, border-right siempre establece los valores de todas las propiedades que puede establecer, incluso si no están especificadas. Establece los no especificados a sus valores por defecto. Lo que significa que ...

css
border-right-style: dotted;
border-right: thick green;

... es en realidad lo mismo que ...

css
border-right-style: dotted;
border-right: none thick green;

... y el valor de border-right-style dado previamente a border-right es ignorado. Puesto que el valor por defecto de border-right-style es none, si no se especifica la parte border-style el resultado es no establecer un borde.

Sintaxis

css
border-right: 1px;
border-right: 2px dotted;
border-right: medium dashed green;

Los tres valores de la propiedad rápida pueden ser especificados en cualquier orden, incluso omitiendo uno o dos de ellos.

Valores

Formal syntax

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

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

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

Ejemplo

html
<div>Esta caja tiene un borde en el lado derecho.</div>
css
div {
  border-right: 4px dashed blue;
  background-color: gold;
  height: 100px;
  width: 100px;
  font-weight: bold;
  text-align: center;
}

Especificaciones

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

Compatibilidad con navegadores

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
border-right

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support