Acrossing/Códigos
Acerca del autor
Más de Acrossing
Otros colaboradores recientes
Hola a todos. Hoy les voy a hablar de los códigos div y span. Són ambos alteradores de texto entre otras cosas, es decir: que puedo cambiar la fuente, el color, tamaño, etc.
Estos códigos suelen ir acompañados por la "aplicación" style, que da las distintas propiedades.
Todas las aplicaciones se unen a un div, span, tablas, etc. de la siguiente forma:
<div> => <div style=""> => <div style="color:blue">
Los div, spans, etc. deben ser cerrados cuando se hayan terminado de usar o cuando llegue el final de ese div (por ejemplo: aquí el color azul desaparece). Se cierra así:
</div>, </span>, </big>, etc. <= Aquí podemos observar que es poniendo el mismo nombre del código (sin las aplicaciones como style, align, etc.) con una barra (/) antes.
Vamos a estudiar la aplicación style a fondo:
<span style="configuración:cantidad,objeto;"> <= el punto y coma (;) sirve básicamente para separar si hay más de una configuración, así que en el caso de haber sólo una configuración no importará no ponerlo.
Tipos de "configuraciones":
Aquí pondremos las configuraciones básicas:
- 1. color del texto: color:Nombredelcolor (uno de estos) => <span style="color:blue;">
Código: <span style="color:blue;">TEXTO CUALQUIERA (AZUL)</span> También posible en div.
TEXTO CUALQUIERA (AZUL)
- 2. tamaño de texto: font-size:Tamañocualquiera => <span style="font-size:150%;">
Código: <span style="font-size:150%;">TEXTO DE TAMAÑO 150%</span>
TEXTO DE TAMAÑO 150%
ATENCIÓN: Podemos indicar el tamaño de dos formas:
- En %, dando por supuesto que el 100% es el tamaño normal
- En píxeles (px)
TEXTO DE TAMAÑO 110%
TEXTO DE TAMAÑO 110px
Como ven, hay una diferencia importante en tamaño.
- 2. fuente de texto: font-family:Fuente (por ejemplo: Times New Roman) => <span style="font-family:Times New Roman;">
Código: <span style="font-family:Times New Roman;">TEXTO CON TIMES NEW ROMAN</span>
TEXTO CON TIMES NEW ROMAN
COMBINACIONES
Cuando mecioné al principio la función del punto y coma (;) dije que era para separar varias modificaciones, y ahora vamos a ver un ejemplo:
Código: <div style="color:blue;font-size:150%;font-family: Times New Roman;">COMBINACIÓN DE TEXTO AZUL, TAMAÑO 150% Y TIMES NEW ROMAN</div>
Códigos en los que se recomienda el div y algunos que són exclusivos (es decir, que no sirve el span u otros, sólo con divs y tablas):
- Background: tal como pueden deducir traduciendo del inglés, bakcground es fondo, así que vamos a trabajar el código para poner un fondo:
<div style="background:lime;">TEXTO, TEXTO, TEXTO, TEXTO, TEXTO Y MÁS TEXTO</div>
- Text-align: Código de alineación de texto, muy simple y aplicable tambén a span y otros. Hay tres posiciones de alineación: left (izquierda), right (derecha) y center (medio):
<div style="text-align:right;">TEXTO ALINEADO A LA DERECHA</div>
