Puede que se de el caso de que halles algún error en tu código o trabajo, recuerda probar siempre en un entorno de testing antes subir el código al trabajo final.
Esta función no es estándar y no se encuentra en una pista de estándares. No lo use en sitios de producción frente a la Web: no funcionará para todos los usuarios. También puede haber grandes incompatibilidades entre las implementaciones y el comportamiento puede cambiar en el futuro.
los -webkit-text-stroke-color
La propiedad CSS especifica el color del trazo de los caracteres del texto. Si esta propiedad no se establece, el valor de la color
se utiliza la propiedad.
/*values */ -webkit-text-stroke-color: red;-webkit-text-stroke-color: #e08ab4;-webkit-text-stroke-color:rgb(200, 100, 0);/* Global values */-webkit-text-stroke-color: inherit;-webkit-text-stroke-color: initial;-webkit-text-stroke-color: unset;
Sintaxis
Valores
- El color del trazo.
Definicion formal
Valor inicial | currentcolor |
---|---|
Se aplica a | todos los elementos |
Heredado | sí |
Valor calculado | color calculado |
Tipo de animación | un color |
Sintaxis formal
where
= | | | | | | currentcolor | where
= rgb( 3[ / ]? ) | rgb( 3[ / ]? ) | rgb( #3 , ? ) | rgb( #3 , ? ) = rgba( 3[ / ]? ) | rgba( 3[ / ]? ) | rgba( #3 , ? ) | rgba( #3 , ? ) = hsl( [ / ]? ) | hsl( , , , ? ) = hsla( [ / ]? ) | hsla( , , , ? ) where
= | = |
Ejemplos de
Variar el color del trazo
HTML
<p>Text with strokep><inputtype="color"value="#ff0000">
CSS
pmargin: 0;font-size: 4em;-webkit-text-stroke-width: 3px;-webkit-text-stroke-color: #ff0000;/* Can be changed in the live sample */
Resultados
Especificaciones
Especificación | Estado | Comentario |
---|---|---|
Estándar de compatibilidad La definición de ‘-webkit-text-stroke-color’ en esa especificación. |
Estándar de vida | Estandarización inicial |
Referencia CSS de Safari ‘-webkit-text-stroke-color’ en ese documento. |
Documentación no oficial no estándar | Documentación inicial |
Compatibilidad del navegador
Escritorio | Móvil | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Cromo | Borde | Firefox | explorador de Internet | Ópera | Safari | WebView Android | Chrome Android | Firefox para Android | Opera Android | Safari en IOS | Internet de Samsung | |
-webkit-text-stroke-color |
1 | 15 | 4948 | No | 15 | 3 | 37 | 18 | 4948 | 15 | 2 | 1.0 |
Ver también
- Publicación de blog de Surfin ‘Safari que anuncia esta función
- Artículo de CSS-Tricks que explica esta característica
-webkit-text-fill-color
-webkit-text-stroke-width
-webkit-text-stroke
Comentarios y puntuaciones de la guía
Recuerda que te permitimos decir si te fue de ayuda.