border-end-start-radius

Esta traducción está incompleta. Por favor, ayuda a traducir este artículo del inglés.

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-end-start-radius define un radio del borde lógico en un elemento, que se asigna a un radio de borde físico que depende de los elementos writing-mode, direction, y text-orientation.

/* <length> values */
/* With one value the corner will be a circle */
border-end-start-radius: 10px;  
border-end-start-radius: 1em;   

/* With two values the corner will be an ellipse */
border-end-start-radius: 1em 2em;

/* Global values */
border-end-start-radius: inherit;
border-end-start-radius: initial;
border-end-start-radius: unset;

Por ejemplo, en un modo de escritura  horizontal-tb, esta propiedad corresponde a la propiedad border-top-right-radius.

Sintaxis

Valores

<length-percentage>
Indica el tamaño del radio del círculo o los ejes semi mayor y semi menor de la elipse. Como longitud absoluta, se puede expresar en cualquier unidad permitida por el tipo de datos CSS <length>. Los porcentajes para el eje horizontal se refieren al ancho de la caja, los porcentajes para el eje vertical se refieren a la altura de la caja. Los valores negativos no son válidos.

Sintaxis formal

<length-percentage>{1,2}

where
<length-percentage> = <length> | <percentage>

Ejemplo

Contenido HTML

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

Contenido CSS

div {
  background-color: rebeccapurple;
  width: 120px;
  height: 120px;
  border-end-start-radius: 10px;
}

.exampleText {
  writing-mode: vertical-rl;
  padding: 10px;
  background-color: #fff;
  border-end-start-radius: 10px;
}

Especificación

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

Valor inicial0
Applies toall elements; but User Agents are not required to apply to table and inline-table elements when border-collapse is collapse. The behavior on internal table elements is undefined for the moment.. It also applies to ::first-letter.
Heredableno
Percentagesrefer to the corresponding dimension of the border box
Mediavisual
Valor calculadotwo absolute lengths or percentages
Animation typea length, percentage or calc();
Canonical orderel orden único no-ambigüo definido por la gramática formal

Compatibilidad en navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome para AndroidEdge MobileFirefox para AndroidOpera para AndroidSafari en iOSSamsung Internet
border-end-start-radius
Experimental
Chrome Sin soporte NoEdge Sin soporte NoFirefox Soporte completo 66IE Sin soporte NoOpera Sin soporte NoSafari Sin soporte NoWebView Android Sin soporte NoChrome Android Sin soporte NoEdge Mobile Sin soporte NoFirefox Android Soporte completo 66Opera Android Sin soporte NoSafari iOS Sin soporte NoSamsung Internet Android Sin soporte No

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte
Experimental. Esperar que el comportamiento cambie en el futuro.
Experimental. Esperar que el comportamiento cambie en el futuro.

Mira también

Etiquetas y colaboradores del documento

Colaboradores en esta página: teffcode
Última actualización por: teffcode,