border-inline-style

Estás leyendo la versión en inglés del artículo porque aún no existe una traducción para este idioma. ¡Ayúdanos a traducir este artículo!

Esta es una tecnología experimental
Comprueba la Tabla de compabilidad de navegadores cuidadosamente antes de usarla en producción.

 

La propiedad de CSS border-inline-style define el estilo de los bordes lógicos en línea de un elemento, que se asigna al estilo de borde físico dependiendo del modo de escritura, la direccionalidad y la orientación del texto del elemento. Esto corresponde a las propiedades border-top-styleborder-bottom-style, o border-left-style, y border-right-style dependiendo de los valores definidos por writing-mode, direction, y text-orientation.

/* <'border-style'> values */
border-inline-style: dashed;
border-inline-style: dotted;
border-inline-style: groove;

El estilo del borde en otra dimensión puede establecerse con border-block-style, que establece border-block-start-style, y border-block-end-style.

Valor inicialnone
Applies toall elements
Heredableno
Mediavisual
Valor calculadocomo se especifica
Animation typediscrete
Canonical orderel orden único no-ambigüo definido por la gramática formal

Sintaxis

Valores

<'border-style'>
La línea de estilo del borde. Mira border-style.

Sintaxis formal

<'border-top-style'>

Ejemplo

Contenido HTML

<div>
  <p class="exampleText">Example text</p>
</div>

Contenido CSS

div {
  background-color: yellow;
  width: 120px;
  height: 120px;
}

.exampleText {
  writing-mode: vertical-lr;
  border: 5px solid blue;
  border-inline-style: dashed;
}

Especificación

Especificación Estado Comentario
CSS Logical Properties and Values Level 1
La definición de 'border-inline-style' en esta especificación.
Editor's Draft Definición inicial.

Compatibilidad en navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome para AndroidFirefox para AndroidOpera para AndroidSafari en iOSSamsung Internet
border-inline-styleChrome Soporte completo 69Edge Sin soporte NoFirefox Soporte completo 66IE Sin soporte NoOpera Soporte completo 56Safari Sin soporte NoWebView Android Soporte completo 69Chrome Android Soporte completo 69Firefox Android Soporte completo 66Opera Android Soporte completo 48Safari iOS Sin soporte NoSamsung Internet Android Sin soporte No

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte

 

Mira también