Significado de los corchetes en el CSS

Autor: Robert Simon
Fecha De Creación: 22 Junio 2021
Fecha De Actualización: 14 Mayo 2024
Anonim
5 Ways to Center with CSS! [VOICE TUTORIAL]
Video: 5 Ways to Center with CSS! [VOICE TUTORIAL]

Contenido

La sigla CSS viene del inglés "cascading style sheets", o "hojas de estilo en cascada". CSS da un mayor grado de control artístico y de diseño a desarrolladores web y diseñadores, separando el contenido de los parámetros de visualización. Las instrucciones del CSS se colocan en el encabezado de un documento web y luego se indican dentro del cuerpo de la página web por claves - {}. Dentro de las llaves quedan los paréntesis - () - o corchetes - [] - que designan otros elementos del CSS.


Los corchetes del CSS se utilizan dentro del cuerpo de un documento web (Comstock / Comstock / Getty Images)

llaves

Las claves son los elementos primarios de la sintaxis de CSS. Ellos significan la apertura y el cierre de todos los parámetros de CSS contenidos dentro de ellos. Representados como {}, siguen los elementos de CSS que significan una imagen, posición, elemento de visualización o cualquier combinación de elementos. Las claves pueden existir dentro de cualquier elemento div / capa, y siempre están dentro de las etiquetas "</ body>". Este es un ejemplo:

div # example {padding: 5px; margin: 20px; width: 350px; }

paréntesis

Los elementos relacionales, como porcentajes y colores, se encuentran dentro de paréntesis. Los paréntesis dan definición adicional a los elementos del CSS. En las versiones del CSS anteriores al CSS3, los paréntesis podían definir elementos de la misma forma que las claves. Dos ejemplos son el color (definido por el código hexadecimal) y las imágenes de fondo, respectivamente:


color: rgb (128, 128, 255); imagen: url ( "/ images / bg.png")

soportes

Los corchetes - [] -, conocidos como selectores de atributos, se utilizan para designar valores de atributos de un elemento. Había cuatro valores diferentes en el CSS2 y se añadieron tres con CSS3. Los cuatro selectores originales definen la presencia del atributo - [title], correspondiente a cualquier elemento que tenga un atributo "title" (título) especificado; el valor de atributo simple - input [type = "enviar"], correspondiente a cualquier elemento de entrada cuyo tipo de atributo sea igual a "enviar"; el valor de atributo de lista - p [class ~ = "literario"], correspondiente a párrafos cuyo atributo de clase sea una lista de palabras separadas por espacios, una de las cuales es "literario"; y el valor de atributo parcial - a [href ^ = "http:"], correspondiente a elementos de enlace cuyo valor de atributo comienza con "http:". Los corchetes no eran muy usados ​​antes de la introducción de Internet Explorer 7, pues el IE6 no los reconocía.


Muchos símbolos algebraicos se utilizan como elementos de CSS (BananaStock / BananaStock / Getty Images)

galones

Los selectores y secciones de documentos básicos del lenguaje de marcado de hipertexto (en inglés, hypertext markup language, o HTML) y del lenguaje de marcado extensible (en inglés, extensible markup language, o XML) están delimitados por corchetes puntiagudos, conocidos como chevrons . También representan un elemento secundario de algunos elementos de CSS. En el CSS, un "selector secundario" está formado por dos o más elementos separados por el chevron ">". Estos denota ciertas secciones definidas de una página web: el cuerpo, que es la página visible; las capas, que pueden ser apiladas como hojas de papel por encima unas de otras; o la titulación, que denota ciertos objetos o fechas conocidas como "microformatos".

Notas en CSS

Separados de los corchetes del CSS, pero aún así una herramienta organizativa valiosa para los diseños en CSS elaborados, son notas de hojas de estilo. Estos son comentarios que no añaden nada al código HTML, y por lo tanto no aumentan el tiempo de carga de las páginas; que proporcionan un contorno para el CSS largo y elaborado. Las notas en el CSS se colocan dentro de su propio atributo - / * - de esta manera:

/ Cualquier comentario se contiene dentro de segmentos delimitados por una barra y un asterisco. /

Pueden ser inmensamente valiosas para ayudar a recorrer secciones de hojas de estilo en cascada.

CSS puede ayudar a diseñar páginas para diferentes tamaños de pantalla sin crear diseños separados (Comstock / Comstock / Getty Images)

referencias

  • "CSS Mastery: Advanced Web Standards Solutions"; Andy Budd, et al .; 2009
  • W3 Schools: Sintaxis de CSS [en inglés]
  • "The Ultimate CSS Reference"; Tommy Olsson, et al .; 2008

medio

  • W3C: Selectores de CSS [en inglés]
  • New2HTML: La sintaxis de CSS [en inglés]