outline-offset
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since abril de 2017.
Resumen
La propiedad CSS outline-offset es usada para establecer el espacio entre un contorno outline y el límite o borde de un elemento. Un contorno es una línea que se dibuja al rededor de los elementos, fuera de los límites de su borde.
| Valor inicial | 0 |
|---|---|
| Applies to | all elements |
| Heredable | no |
| Valor calculado | as specified, but with relative lengths converted into absolute lengths |
| Animation type | a length |
El espacio será transparente (el elemento padre determinará el fondo).
Sintaxis
css
/* Valores <length> */
outline-offset: 3px;
outline-offset: 0.2em;
/* Valores globales */
outline-offset: inherit;
outline-offset: initial;
outline-offset: unset;
Valores
Sintaxis formal
outline-offset =
<length>
Ejemplos
css
p {
outline: dashed thin;
/* Mueve el contorno 10px lejos del borde */
outline-offset: 10px;
border: 1px solid black;
}
Html
html
<p>outline: offset 10px. Border is solid and outline is dashed</p>
El código anterior producirá este efecto:
Otro ejemplo
Especificaciones
| Specification |
|---|
| CSS Basic User Interface Module Level 4 # outline-offset |
Compatibilidad con navegadores
Loading…