From a55b575e8089ee6cab7c5c262a7e6db55d0e34d6 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:46:50 +0100 Subject: unslug es: move --- .../es/web/css/value_definition_syntax/index.html | 402 +++++++++++++++++++++ 1 file changed, 402 insertions(+) create mode 100644 files/es/web/css/value_definition_syntax/index.html (limited to 'files/es/web/css/value_definition_syntax') diff --git a/files/es/web/css/value_definition_syntax/index.html b/files/es/web/css/value_definition_syntax/index.html new file mode 100644 index 0000000000..90d5ea8b75 --- /dev/null +++ b/files/es/web/css/value_definition_syntax/index.html @@ -0,0 +1,402 @@ +--- +title: Sintaxis de definición de valor +slug: Web/CSS/Sintaxis_definición_de_valor +translation_of: Web/CSS/Value_definition_syntax +--- +

{{CSSRef()}}

+ +

La sintaxis de definición de valores CSS, una gramática formal, se utiliza para definir el conjunto de valores válidos para una propiedad o función CSS. Además de esta sintaxis, el conjunto de valores válidos puede restringirse aún más mediante restricciones semánticas (por ejemplo, para que un número sea estrictamente positivo).

+ +

La sintaxis de definición describe qué valores están permitidos y las interacciones entre ellos. Un componente puede ser una palabra clave, algunos caracteres literales, ó un valor de tipo de dato de CSS o propiedad CSS.

+ +

Tipos de valor de los componentes

+ +

Palabras clave

+ +

Palabras clave genéricas

+ +

Una palabra clave con significado predefinido aparece literalmente, sin comillas, por ejemplo: auto, smaller or ease-in.

+ +

El caso específico de inherit e initial

+ +

Todas las propiedades CSS aceptan las palabras clave inherit e initial que son definidas vía CSS. Estas no son mostradas en la definición del valor y están implícitamente definidas.

+ +

Literales

+ +

En CSS, unos pocos caracteres pueden aparecer por su cuenta, como la barra ('/') o la coma (','), y son usadas en una propiedad o definición para separar sus partes. La coma es a menudo usada para separar valores en enumeraciones, o parámetros en funciones de tipo matemático; la barra a menudo separa partes de el valor que es semánticamente diferente, pero que tiene una sintaxis común. Típicamente, la barra es usada a veces en propiedades abreviadas para separar componentes que son del mismo tipo, pero pertenecen a diferentes propiedades.

+ +

Ambos símbolos aparecen literalmente en una definición de valor.

+ +

Tipos de dato

+ +

Tipos de dato básicos

+ +

Un tipo de dato usado vía CSS es definido una sola vez para todos los valores en la especificación. Se llaman tipos de datos básicos, estan representados por su nombre rodeados del símbolo '<' y '>': {{ cssxref("<angle>") }}, {{cssxref("<string>")}}, …

+ +

Tipos de dato no terminales

+ +

Tipos de dato poco comunes, llamados tipos de datos no terminales, están también rodeados por  '<' y '>'.

+ +

Los tipos de dato no terminales son de dos tipos::

+ + + +

Combinadores de los valores de componentes

+ +

Corchetes

+ +

Corchetes encierran varias entidades, combinadores, y multiplicadores, luego los transforman en un solo componente. Son usados para agrupar componentes para sobreescribir las reglas de precedencia.

+ +
bold [ thin && <length> ]
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no con:

+ + + +

Yuxtaposición

+ +

Colocar varias palabras clave, literales, o tipos de datos, uno al lado del otro, solo separados por uno o varios espacios se llama yuxtaponer. Todos los componentes yuxtapuestos son obligatorios y deben aparecer en ese orden exacto.

+ +
bold <length> , thin
+
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no con:

+ + + +

Doble ampersand

+ +

Separar dos o mas componentes por un doble ampersand, &&, significa que todas esas entidades son obligatorias pero pueden aparecer en cualquier orden.

+ +
bold && <length>
+
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no con:

+ + + +
Nota: yuxtaposición tiene precedencia sobre el doble ampersand, esto quiere decir que bold thin && <length> es equivalente a [ bold thin ] && <length>. Que describe a bold thin <length> ó <length> bold thin pero no a  bold <length> thin.
+ +

Barra doble

+ +

Separar dos o mas componentes por una barra doble, ||, significa que todas las entidades son opcionales: al menos una debe estar presente, y pueden aparecer en cualquier orden. Típicamente ésto es usado para definir los diferentes valores de una propiedad abreviada.

+ +
<'border-width'> || <'border-style'> || <'border-color'>
+
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no con:

+ + + +
Nota: el doble ampersand tiene precedencia sobre la barra doble, que significa que bold || thin && <length> es equivalente a bold || [ thin && <length> ]. Describe a bold, thin, <length>, bold thin, <length> bold, o thin <length> bold pero no bold <length> bold thin porque bold, si no es omitido debe colocarse antes o después de el componente thin && <length>
+ +

Barra simple

+ +

Separar dos o mas componentes con una barra simple, |, quiere decir que todas las entidades son opciones exclusivas: exactamente una de estas opciones debe estar presente. Esto es tipicamente usado para separar una lista de posibles palabras clave.

+ +
<percentage> | <length> | left | center | right | top | bottom
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no

+ + + +
+

Note: la barra doble tiene precedencia sobre la barra simple, quiere decir que bold | thin || <length> es equivalente a bold | [ thin || <length> ]. Describe bold, thin, <length>, <length> thin, o thin <length> pero no bold <length> porque solo una entidad de cada lado del combinador | puede estar presente.

+
+ +

Multiplicadores de valores de componentes

+ +

Un multiplicador es un símbolo que indica cuantas veces una entidad precedente puede ser repetida. Sin un multiplicador, una entidad debe aparecer exactamente una vez.

+ +

Note que los multiplicadores no pueden sumarse y tienen precedencia sobre los combinadores.

+ +

Asterisco (*)

+ +

El multiplicador asterisco indica que la entidad puede aparecer cero, una o varias veces.

+ +
bold smaller*
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no:

+ + + +

Suma (+)

+ +

El multiplicador suma indica que la entidad puede aparecer una o varias veces.

+ +
bold smaller+
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no:

+ + + +

Pregunta (?)

+ +

El multiplicador pregunta indica que la entidad es opcional y debe aparecer cero o una vez

+ +
bold smaller?
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no:

+ + + +

Llaves ({ })

+ +

El multiplicador llaves, encierra a dos enteros A y B separados  por una coma, indica que la entidad debe aparecer al menos A veces y como mas B veces

+ +
bold smaller{1,3}
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no:

+ + + +

Hash (#)

+ +

El multiplicador hash indica que la entidad puede repetirse una o mas veces (como con el multiplicador de suma) pero cada ocurrencia se separa por una coma (',').

+ +
bold smaller#
+ +

El ejemplo empareja con los siguientes valores:

+ + + +

Pero no:

+ + + +

Sumario

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SímboloNombreDescripciónEjemplo
Combinadores
 YuxtaposiciónComponentes obligatorios que deben aparecer en el mismo ordensolid <length>
&&Doble ampersandComponentes obligatorios pero que pueden aparecer en cualquier ordenlength> && <string>
||Barra dobleAl menos uno de los componentes debe estar presente, y pueden aparecer en cualquier orden<'border-image-outset'> || <'border-image-slice'>
|Barra simpleExactamente uno de los componentes debe estar presentesmaller | small | normal | big | bigger
[ ]CorchetesAgrupa componentes para sobreescribir las reglas de precedenciabold [ thin && <length> ]
Multiplicadores
 Sin multiplicadorExactamente 1 vezsolid
*Asterisco0 or more timesbold smaller*
+Suma1 o mas vecesbold smaller+
?Pregunta0 o 1 vez (es opcional)bold smaller?
{A,B}LlavesAl menos A veces, como mas B vecesbold smaller{1,3}
#Hash1 o mas veces, pero cada ocurrencia separada por una coma (',')bold smaller#
+ +

Especificaciones

+ + + + + + + + + + + + + + + + + + + + + + + + +
EspecificaciónEstadoComentario
{{ SpecName('CSS3 Values', '#value-defs', 'Value definition syntax') }}{{ Spec2('CSS3 Values') }}Desde {{ SpecName('CSS2.1', 'about.html#value-defs', 'Value definition syntax') }}, añade el multiplicador hash
{{ SpecName('CSS2.1', 'about.html#value-defs', 'Value definition syntax') }}{{ Spec2('CSS2.1') }}Desde {{ SpecName('CSS1', '#notation-for-property-values', 'Value definition syntax') }}, añade el combinador doble ampersand
{{SpecName('CSS1', '#notation-for-property-values', 'Value definition syntax') }}{{ Spec2('CSS1') }}Definición inicial
+ +

Vea también

+ + -- cgit v1.2.3-54-g00ecf