Cómo Establecer La Sangría

Tabla de contenido:

Cómo Establecer La Sangría
Cómo Establecer La Sangría

Video: Cómo Establecer La Sangría

Video: Cómo Establecer La Sangría
Video: CÓMO APLICAR LA SANGRÍA FÁCILMENTE EN WORD SEGÚN NORMAS APA SÉPTIMA EDICIÓN (7ma.) 2024, Noviembre
Anonim

Muy a menudo, para especificar el tamaño de las sangrías en las páginas HTML, se utilizan las capacidades del lenguaje CSS (Hojas de estilo en cascada). Aunque en el lenguaje HTML en sí hay varios remanentes "rudimentarios", lo que permite en algunos casos establecer sangrías. A continuación se muestran las opciones que se utilizan con más frecuencia, pero además de ellas, todavía hay muchos tipos diferentes de trucos que le permiten establecer sangrías para el marcado no estándar de documentos HTML.

Cómo establecer la sangría
Cómo establecer la sangría

Es necesario

Conocimientos básicos de lenguajes HTML y CSS

Instrucciones

Paso 1

Determine el elemento de la página desde el que aplicar la sangría. Por ejemplo, si el texto se coloca dentro de la etiqueta … (bloque), este bloque será el elemento principal de este texto y la sangría debe contarse desde los bordes del bloque. Y si el texto (o imagen) no está dentro de ningún bloque (div, li, etc.) o elementos en línea (span, p, etc.), entonces su padre será el cuerpo del documento (etiqueta del cuerpo). Es necesario definir un elemento padre para el texto porque es él quien necesita establecer las descripciones de los estilos que forman las sangrías. Supongamos que su texto se coloca dentro de un bloque div: Texto de muestra

Paso 2

Utilice la propiedad de margen del lenguaje CSS para establecer márgenes, es decir, la distancia desde los bordes de un elemento a los elementos adyacentes, así como a los bordes del elemento principal. Esta distancia se puede establecer por separado para el relleno en cada lado: margen superior - en la parte superior, margen-derecho - a la derecha, margen-inferior - en la parte inferior, margen-izquierdo - a la izquierda. Para el ejemplo anterior, este código CSS podría verse así: div {

margen superior: 10px;

margen derecho: 15px;

margen inferior: 40px;

margen izquierdo: 70px;

} Aquí "div" es un selector que especifica que este estilo debe aplicarse a todos los div en el código del documento. La sintaxis CSS le permite combinar las cuatro líneas en una: div {

margen: 10px 15px 40px 70px;

} Los valores de las sangrías siempre deben especificarse en este orden: primero - en la parte superior, luego - a la derecha, abajo e izquierda. Si las sangrías son iguales en todos los lados, entonces es suficiente especificar el valor una vez: div {

margen: 70px;

} Además, puede establecer un margen horizontal flotante (es decir, izquierdo y derecho). Esto puede resultar muy útil cuando necesite establecer un bloque de un ancho determinado exactamente en el centro de la ventana del navegador. El navegador en sí determina automáticamente cuánta sangría debe haber en ambos lados, si escribe la siguiente declaración CSS: div {

margen: 0 automático;

}

Paso 3

Use la propiedad padding para establecer el padding, que es la distancia desde el borde de un elemento a cualquier elemento colocado dentro de él, incluido el texto. La sintaxis de esta propiedad es exactamente la misma que la de la propiedad margin: div {

padding-top: 10px;

padding-right: 15px;

fondo acolchado: 40px;

padding-left: 70px;

} O div {

relleno: 10px 15px 40px 70px;

}

Paso 4

Utilice la propiedad text-indent para establecer la sangría adicional para la primera línea de cada párrafo de texto. Por ejemplo: div {

sangría de texto: 80px;

}

Paso 5

Utilice los atributos hspace y vspace de la etiqueta HTML img para establecer la sangría horizontal y vertical de la imagen a los elementos externos, respectivamente. Por ejemplo, así:

Paso 6

Utilice el atributo de relleno de celda de la etiqueta de la tabla si necesita establecer la sangría desde los bordes de las celdas de la tabla hasta su contenido. Y el atributo de espacio entre celdas establece el espacio entre las celdas de la tabla. Por ejemplo:

1 2

Recomendado: