Guía de inicio de CSS - Introducción

Guía de inicio de CSS - Introducción
Las hojas de estilo en cascada (CSS) es un lenguaje de alto nivel basado en computadora, que se utiliza para diseñar páginas web basadas en HTML. El diseño de una página incluye diseños, colores, tamaño de fuente, estilos de escritura y mantienen el diseño de la página. En este artículo, aprenderá sobre el lenguaje de estilo más poderoso, y también aprenderá cómo las reglas CSS a HTML. Las propiedades de estilo CSS están integradas con las etiquetas HTML. CSS no es marcado o lenguaje de procedimiento; Es un lenguaje declarativo que define sus propias reglas de acuerdo con el estilo de los atributos.

Sintaxis CSS

La sintaxis de CSS comprende un bloque de selección y declaración y el bloque de declaraciones contiene las propiedades y sus valores. Como se muestra en el ejemplo dado

H1
Text-Align: Right;

En este ejemplo "H1" es un selector, "texto alineado" es una propiedad, y "bien" es el valor de la propiedad mencionada.

Selector de CSS

Al igual que HTML tiene etiquetas al igual que CSS tiene selectores, que se utilizan para acceder a los elementos HTML y diseñarlos internamente o usar un archivo CSS externo. Estos selectores se utilizan para aplicar las propiedades CSS específicas en elementos HTML seleccionados.

Se puede seleccionar un elemento utilizando el nombre de los elementos, la identificación y el nombre de la clase. Por ejemplo, para acceder a un elemento con el nombre de la clase, coloque un punto (.) antes del nombre de clase como se muestra en el ejemplo dado.

.centro
Text-Align: Right;
color verde;

Según el ejemplo anterior, los elementos HTML con la clase "Center" estarán alineados a la derecha y tienen color verde.







Se implementa la clase CSS.



Cómo implementar CSS en HTML?

Hay tres formas para la implementación de CSS en un archivo HTML:

  • En línea
  • interno y
  • externo.

Estilo CSS en línea

En el estilo en línea, las propiedades de CSS se fijan dentro de las etiquetas HTML utilizando el atributo de estilo como se muestra en el ejemplo dado.

Esta etiqueta se usa para párrafos.

La propiedad de estilo determinado hace que el párrafo específico sea verde. Al usar el estilo CSS en línea, solo puede aplicar este estilo en elementos específicos.

Sin embargo, este estilo CSS en línea no se recomienda porque aumenta la complejidad del código.

Estilo CSS interno

El CSS StylingCan interno se aplicará en la página web completa porque está integrada en la sección Head en una página HTML con un elemento y simplemente podemos acceder a cualquier elelmtn usando selectores CSS. Como se muestra en el ejemplo dado.

Ejemplo




<


Título


Párrafo



Estilo CSS externo

En el estilo CSS externo, se crea un archivo CSS especializado con la extensión de .CSS que se vinculó con el archivo HTML agregando su enlace en la sección Head. Múltiples páginas HTML se pueden usar este archivo externo al mismo tiempo. A continuación se da un ejemplo de archivo de estilo CSS externo.

Ejemplo

estilo.CSS

cuerpo
Color de fondo: verde;

H1
color rojo;

pag
de color negro;

índice.html







Título


Párrafo



Comentarios en CSS

En cada lenguaje de programación, los comentarios no se muestran en el navegador, sin embargo, pueden ayudar a elaborar y comprender el código al momento de la edición.

En CSS, un comentario es escribir entre estos signos ( /* y */). El patrón de un comentario también se muestra en el ejemplo dado:

/ * Este es un comentario */
H1
color rojo;

Conclusión

CSS significa hojas de estilo en cascada y se utiliza para diseñar páginas web basadas en HTML. Al usar el estilo CSS, el diseño de una página que incluye diseños, colores, tamaño de fuente y muchas más cosas se pueden hacer. En esta publicación, la introducción de CSS, la sintaxis de CSS, el funcionamiento de CSS con archivos HTML y cómo escribir comentarios en CSS se explica con la ayuda de ejemplos.