miércoles, 8 de abril de 2009

61.- HTML - color de fondo y color de texto - bgcolor

Sigamos dando vida a nuestra web, esta vez veremos como asignar un color de fondo. Para esto utilizaremos el atributo "bgcolor".

La etiqueta <body> admite los atributos "bgcolor" y "text", con lo que podremos seleccionar para nuestra web, un color de fondo y un color de texto diferentes a los que nos asigna el sistema por defecto.

código     : <body bgcolor="color" text="color">

resultado: muestra la página y el texto con los colores seleccionados.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente - Colores</title>
  </head>
   <body bgcolor="green" text="yellow">
        Se muestra Texto color amarillo sobre<br>
          fondo de la página color verde.
  </body
</html>

El ejemplo en el navegador:

colorfondo

Nota: también podéis asignar los colores como vimos en el post anterior en formato rgb. (60.- HTML Estilos y efectos de fuentes - Color)

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: MailxMail

Temas anteriores *
60.- HTML Estilos y efectos de fuentes - Color
59.- HTML - Estilos y efectos de fuentes <sub></sub> subíndice
58.- HTML - Estilos y efectos de fuentes <sup></sup> superindice
57.- HTML - Estilos y efectos de fuentes <small></small> pequeño
56.- HTML - Estilos y efectos de fuentes <big><big> grande.
55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
soolucionesfdobco

martes, 7 de abril de 2009

60.- HTML - Estilos y efectos de fuentes - Color

Vamos a alegrar nuestra web, o resaltar nuestros textos con colores.

Para indicar el color de un texto se utiliza la propiedad "font" con el atributo "color".

código     : <font color="#FF0000">Rojo</font>
resultado: muestra el texto entre las etiquetas en color rojo.

Hay dos formas de indicar el valor de la propiedad color, la primer en sus valores RGB (red, green, blue) rojo, verde, azul, es decir que combinando estos valores se obtienen los diferentes colores, o con sus nombres en ingles.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente - Colores</title>
  </head>
  <body>
    <font color="#000000">Negro</font> <br>
    <font color="#C0C0C0">Plata</font> <br>
    <font color="#808080">Gris</font> <br>
    <font color="#FFFFFF">Blanco</font> <- Blanco<br>
    <font color="#800000">Marron</font> <br>
    <font color="#FF0000">Rojo</font> <br>
    <font color="#8800080">Purpura</font> <br>
    <font color="#FF00FF">Fucsia</font> <br>
    <font color="#008000">Verde</font> <br>
    <font color="#00FF00">Verde lima</font> <br>
    <font color="#808000">Verde Oliva</font> <br>
    <font color="#FFFF00">Amarillo</font> <br>
    <font color="#000080">Azul Marino</font> <br>
    <font color="#0000FF">Azul</font> <br>
    <font color="#008080">Azul Verdoso</font> <br>
    <font color="#00FFFF">Celeste</font> <br>
</body>
</html>

El ejemplo en el navegador:

Negro
Plata
Gris
Blanco <- Blanco
Marron
Rojo
Purpura
Fucsia
Verde
Verde lima
Verde Oliva
Amarillo
Azul Marino
Azul
Azul Verdoso
Celeste

y ahora el mismo ejemplo pero dándole a los atributos de color su valor en ingles, su representación en el explorador es la misma que para los valores RGB de antes.

<html>
  <head>
    <title>Fuente - Colores</title>
  </head>
  <body>
    <font color="black">Negro</font> <br>
    <font color="silver">Plata</font> <br>
    <font color="gray">Gris</font> <br>
    <font color="white">Blanco</font> <- Blanco<br>
    <font color="maroon">Marron</font> <br>
    <font color="red">Rojo</font> <br>
    <font color="purple">Purpura</font> <br>
    <font color="fuchsia">Fucsia</font> <br>
    <font color="green">Verde</font> <br>
    <font color="lime">Verde lima</font> <br>
    <font color="olive">Verde Oliva</font> <br>
    <font color="yellow">Amarillo</font> <br>
    <font color="navy">Azul Marino</font> <br>
    <font color="blue">Azul</font> <br>
    <font color="teal">Azul Verdoso</font> <br>
    <font color="aqua">Celeste</font> <br>
</body>
</html>

Nota: Se aconseja utilizar estos colores que son los que la mayoría de los navegadores incluyen en su paleta de colores, aunque se pueden hacer cientos de variedades utilizando las combinaciones rgb, no todos los colores obtenidos se encuentran en las paletas de colores de los navegadores con lo que no se obtendrían los resultados deseados.

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Semarimoli

Temas anteriores *
59.- HTML - Estilos y efectos de fuentes <sub></sub> subíndice
58.- HTML - Estilos y efectos de fuentes <sup></sup> superindice
57.- HTML - Estilos y efectos de fuentes <small></small> pequeño
56.- HTML - Estilos y efectos de fuentes <big><big> grande.
55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita 
soolucionescom

lunes, 6 de abril de 2009

59.- HTML - Estilos y efectos de fuentes <sub></sub> subíndice

Como vimos la opción "sup" muestra en formato superindice, pues bien hoy vemos la opción <sub> que se utiliza para mostrar un texto en formato subindice (fuente pequeña debajo de la linea de texto).

código     : <sub> Texto </sub>
resultado: muestra el texto entre las etiquetas en formato grande.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en formato subindice</title>
  </head>
  <body>
    Este es un texto normal <br>
    <sub>Este es un texto en subindice</sub> <br>
    Aqui un texto normal <sub>subindice</sub> para ver la diferencia
    <br>
   Otro ejemplo, la formula del agua: H<sub>2</sub>O
   </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto en subindice
Aqui un texto normal subindice para ver la diferencia
Otro ejemplo, la formula del agua: H2O

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Documento web

Temas anteriores *
58.- HTML - Estilos y efectos de fuentes <sup></sup> superindice
57.- HTML - Estilos y efectos de fuentes <small></small> pequeño
56.- HTML - Estilos y efectos de fuentes <big><big> grande.
55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
soolucionescom

http://bobuu.blogspot.com

jueves, 2 de abril de 2009

58.- HTML - Estilos y efectos de fuentes <sup></sup> superindice

La opción <sup> se utiliza para mostrar un texto en formato superindice.

código     : <sup> Texto </sup>
resultado: muestra el texto entre las etiquetas en formato grande.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en formato superindice</title>
  </head>
  <body>
    Este es un texto normal <br>
    <sup>Este es un texto en superindice</sup> <br>
    Aqui un texto normal <sup>superindice</sup> para ver la diferencia
    <br>
   </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto en superindice
Aqui un texto normal superindice para ver la diferencia

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Linea de codigo

Temas anteriores *
57.- HTML - Estilos y efectos de fuentes <small></small> pequeño
56.- HTML - Estilos y efectos de fuentes <big><big> grande.
55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
aquituaviso1

miércoles, 1 de abril de 2009

57.- HTML - Estilos y efectos de fuentes <small></small> pequeño

La opción <small> se utiliza para mostrar un texto en formato pequeño.

código     : <small> Texto </small>
resultado: muestra el texto entre las etiquetas en formato grande.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en formato pequeño</title>
  </head>
  <body>
    Este es un texto normal <br>
    <small>Este es un texto pequeño</small>
    <br>
   </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto pequeño

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: HTML net

Temas anteriores *
56.- HTML - Estilos y efectos de fuentes <big><big> grande.
55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font> 
soolucionescom

jueves, 26 de marzo de 2009

56.- HTML - Estilos y efectos de fuentes <big><big> grande.

La opción <big> se utiliza para mostrar un texto en formato grande.

código     : <big> Texto </big>
resultado: muestra el texto entre las etiquetas en formato grande.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en formato grande</title>
  </head>
  <body>
    Este es un texto normal <br>
    <big>Este es un texto grande</big>
    <br>
   </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto grande

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Programación en Castellano

Temas anteriores *
55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
soolucionescom

martes, 24 de marzo de 2009

55.- HTML - Estilos y efectos de fuentes <i></i> italica o cursiva

La opción <i> se utiliza para mostrar un texto en formato itálica o cursiva.

código     : <i> Texto </i>
resultado: muestra el texto entre las etiquetas en formato cursiva.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en italica o cursiva</title>
  </head>
  <body>
    Este es un texto normal <br>
    <i>Este es un texto italica o cursiva</i>
    <br>
   </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto italica o cursiva

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Aulafacil

Temas anteriores *
54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
soolucionesfdobco

lunes, 23 de marzo de 2009

54.- HMTL - Estilos y efectos de fuentes <tt> </tt> teletipo

La opción <tt> para mostrar un texto en formato teletipo o máquina de escribir.

código     : <tt> Texto </tt>
resultado: muestra el texto entre las etiquetas en formato teletipo.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en Teletipo o máquina de escribir</title>
  </head>
  <body>
    Este es un texto normal <br>
    <tt>Este es un texto Teletipo</tt>
    <br>
   </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto Teletipo

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Documento Web

Temas anteriores *
53.- HTML - Estilos y efectos de fuentes <s></s> tachado
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>

soolucionescom

sábado, 14 de marzo de 2009

Nuevo botón de suscripción

Ahora suscribirse a las noticias de nuestro blog es mucho mas fácil, hemos arreglado con Wikio, (el primer agregador europeo, con más de 30 000 sitios y blogs hispanófonos indexados), agregar a nuestro sitio un botón de suscripciones universal RSS.

El botón lo encontraras en el panel derecho

suscribetenuevo

En este botón te permite abonarte al feed con el lector RSS de tu elección. Al hacer click en el botón veras la siguiente imagen donde podrás seleccionar el RSS que más te guste.

wikio

Pruebalo y verás que simple es, podrás estar informado cada vez que un nuevo tema sea publicado, sin tener que visitar el sitio.

sábado, 28 de febrero de 2009

53.- HTML - Estilos y efectos de fuentes <s></s> tachado

Tenemos otra opción a <strike> para mostrar un texto tachado y es <s>.

código     : <s> Texto </s>
resultado: muestra el texto entre las etiquetas tachado.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en Tachado</title>
  </head>
  <body>
    Este es un texto normal <br>
    <s>Este es un texto Tachado</s>
    <br>
    Y este texto tiene una palabra <s>tachada</s> intercalada
  </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto Tachado
Y este texto tiene una palabra tachada intercalada

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Vagabundia

Temas anteriores *
52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>

aquituaviso

jueves, 26 de febrero de 2009

52.- HTML - Estilos y efectos de fuentes <strike><strike/> tachado.

Siguiendo con las opciones que tenemos para darle estilo y efectos a nuestro texto.

Hoy concretamente aprenderemos a marcar como "tachado" un texto, para esto utilizamos la etiqueta <strike></strike>.

código     : <strike> Texto </strike>
resultado: muestra el texto entre las etiquetas tachado.

Pasemos al Código de ejemplo: http://bobuu.blogspot.com
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en Tachado</title>
  </head>
  <body>
    Este es un texto normal <br>
    <strike>Este es un texto Tachado</strike>
    <br>
    Y este texto tiene una palabra <strike>tachada</strike> intercalada
  </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto Tachado
Y este texto tiene una palabra tachada intercalada

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: foromsn

Temas anteriores *
51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>

logo_ponce

miércoles, 25 de febrero de 2009

51.- HTML - Estilos y efectos de fuentes <u></u> subrayado.

Siguiendo con las opciones que tenemos para darle estilo y efectos a nuestro texto.

Hoy concretamente aprenderemos a marcar en "subrayado" un texto, para esto utilizamos la etiqueta <u></u> (en ingles "underlined").

código     : <u> Texto </u>
resultado: muestra el texto entre las etiquetas en subrayado.

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en Subrayado</title>
  </head>
  <body>
    Este es un texto normal <br>
    <u>Este es un texto subrayado</u>
    <br>
    Y este texto tiene una palabra <u>subrayada</u> intercalada
  </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto subrayado
Y este texto tiene una palabra subrayada intercalada

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Ignside

Temas anteriores *
50.- HTML - Estilos y efectos de fuentes <b></b> negrita
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>

ventasonline

domingo, 22 de febrero de 2009

50.- HTML - Estilos y efectos de fuentes <b></b> negrita

En este post comenzamos con con las opciones que tenemos para darle estilo y efectos a nuestro texto.

Hoy concretamente aprenderemos a marcar en "negrita" un texto, para esto utilizamos la etiqueta <b></b>.

código     : <b> Texto </>
resultado: muestra el texto entre las etiquetas en negrita.

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Fuente en negrita-</title>
  </head>
  <body>
    Este es un texto normal <br>
    <b>Este es un texto en negrita</b>
    <br>
    Y este texto tiene una palabra en <b>negrita</b> intercalada
  </body>
</html>

El ejemplo en el navegador:

Este es un texto normal
Este es un texto en negrita
Y este texto tiene una palabra en negrita intercalada.

Nota:

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: HTML en castellano

Temas anteriores *
49.- HTML - Estructuración de Texto - Fuente <basefont>
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>

spainparkhome

sábado, 21 de febrero de 2009

49.- HTML - Estructuración de Texto - Fuente <basefont>

Con "basefont" podemos establecer el tamaño base de la fuente utilizando la etiqueta "size".

Los cambios de tamaño de fuente producidos con "font" son relativos al tamaño establecido con "basefont". No tiene etiqueta de cierre con lo que a partir del uso de esta todo el texto a continuación pasara al nuevo tamaño.

En caso de no utilizarse "basefont", el tamaño de la fuente es el establecido en el atributo.

código     : <basefont size="número" />
resultado: permite mostrar el texto con diferentes fuentes.

En el ejemplo tenéis algunos de los aspectos posibles, podéis probar con otros.

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

Ejemplo de texto en fuente Verdana, de color azul y tamaño 3
Ahora utilizaremos: basefont size=6
Y entonces el Texto desde este punto esta en tamaño 6.

 

Nota: Actualmente este elemento esta en desuso, a cambio se utilizan las hojas de estilo que ya veremos más adelante.

En I. Explorer 7 se ve bien, pero con Chrome no es reconocido.

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Webmasters Lycos

Temas anteriores *
48.- HTML - Estructuración de Texto - Fuente <font></font>
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"

centrovacacional

miércoles, 11 de febrero de 2009

48.- HTML - Estructuración de Texto - Fuente <font></font>

Ahora veremos como determinar el tipo de fuente a utilizar. Lo haremos con el mismo elemento <font> pero en este caso utilizamos el atributo face

código     : <font face = nombre_de_la_fuente></font>
resultado: permite mostrar el texto con diferentes fuentes.

En el ejemplo tenéis algunos de los aspectos posibles, podéis probar con otros.

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Texto - Tipos de Fuente - aspecto</title>
  </head>
  <body>
    <font face="verdana">Fuente con aspecto Verdana</font><br>
    <font face="arial">Fuente con aspecto Arial</font><br>
    <font face="times new roman">Fuente con aspecto Times New Roman</font><br>
    <font face="courier">Fuente con aspecto Courier</font><br>
    <font face="comic sans ms">Fuente con aspecto Comic Sans MS</font>
   </body>
</html>

El código anterior se vería así en el navegador:

Fuente con aspecto Verdana
Fuente con aspecto Arial
Fuente con aspecto Times New Roman
Fuente con aspecto Courier
Fuente con aspecto Comic Sans MS

Nota: Dado que el ordenador del que mira la web puede que no disponga del tipo de fuente seleccionado, se le mostrará la fuente por defecto, para evitar esto, podemos dar varias opciones de fuente, agregándolas separadas por comas, por ejemplo "arial, verdana, courier", en este caso si no es posible mostrar el texto en arial, intentara mostrarlo en verdana, y si no es posible en courier.

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Superhosting

Temas anteriores *
47.- HTML - Estructuración de Texto - Colores <font></font>
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"
38.- Elementos de Estructuración de Texto "<cite></cite>"

aquituaviso

sábado, 7 de febrero de 2009

47.- HTML - Estructuración de Texto - Colores <font></font>

En el post anterior hemos visto como cambiar el tamaño al text, hoy veremos como darle color para que nuestra web sea mas bonita. Lo haremos con el mismo elemento <font> pero con diferente atributo "color".

código     : <font color = nombre del color></font>
resultado: permite mostrar el texto en diferentes colores.

También es posible utilizar los valores sRGB para indicar el color.

En el ejemplo tenéis los colores.

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Texto - Colores de la fuente</title>
  </head>
  <body>
    <font color="black">Texto en color NEGRO</font> atributo = black<br>
    <font color="silver">Texto en color PLATEADO</font> atributo = silver<br>
    <font color="gray">Texto en color GRIS</font> atributo = gray<br>
    <font color="white">Texto en color BLANCO</font> (BLANCO) atributo = white<br>
    <font color="maroon">Texto en color MARRÓN</font> atributo = maroon<br>
    <font color="red">Texto en color ROJO</font> atributo = red<br>
    <font color="purple">Texto en color PÚRPURA</font> atributo = purple<br>
    <font color="fuchsia">Texto en color FUCSIA</font> atributo = fuchsia<br>
    <font color="green">Texto en color VERDE</font> atributo = green<br>
    <font color="lime">Texto en color VERDE LIMA</font> atributo = lime<br>
    <font color="olive">Texto en color VERDE OLIVA</font> atributo = olive<br>
    <font color="yellow">Texto en color AMARILLO</font> atributo = yellow<br>
    <font color="navy">Texto en color AZUL MARINO</font> atributo = navy<br>
    <font color="blue">Texto en color AZUL</font> atributo = blue<br>
    <font color="teal">Texto en color AZUL VERDOSO</font> atributo = teal<br>
    <font color="aqua">Texto en color CELESTE</font> atributo = aqua<br>
   </body>
</html>

El código anterior se vería así en el navegador:

Texto en color NEGRO atributo = black
Texto en color PLATEADO atributo = silver
Texto en color GRIS atributo = gray
Texto en color BLANCO (BLANCO) atributo = white
Texto en color MARRÓN atributo = maroon
Texto en color ROJO atributo = red
Texto en color PÚRPURA atributo = purple
Texto en color FUCSIA atributo = fuchsia
Texto en color VERDE atributo = green
Texto en color VERDE LIMA atributo = lime
Texto en color VERDE OLIVA atributo = olive
Texto en color AMARILLO atributo = yellow
Texto en color AZUL MARINO atributo = navy
Texto en color AZUL atributo = blue
Texto en color AZUL VERDOSO atributo = teal
Texto en color CELESTE atributo = aqua

Nota: Observad que en el ejemplo el color blanco no se ve porque utilizamos un fondo blanco, pero sobre un fondo oscuro queda muy bien.

-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: conclase.net

Temas anteriores *
46.- HTML - Tamaño de la fuente <font></font>
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"
38.- Elementos de Estructuración de Texto "<cite></cite>"
37.- Elementos de estructuración de Texto "<var></var>"

ventasonline

jueves, 5 de febrero de 2009

46.- HTML - Tamaño de la fuente <font></font>

Otro elemento importante es el que nos permite cambiar el tamaño de la fuente, este elemento es el elemento  <font>.

código     : <font></font>
resultado: permite entre otras cosas cambiar el tamaño de la fuente.

Como vereis necesita etiqueta de inicio y de cierre. pero además cuenta con algunos atributos. En este caso veremos el que nos permite cambiar el tamaño de la fuente "size".

Los valores posibles son un número entero entre 1 y 7. Por ejemplo el tamaño "2", significa dos tamaños mayor.

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Texto - Tamaños de la fuente</title>
  </head>
  <body>
     <font size="1">tamaño de fuente con size = 1</font><br>
     <font size="2">tamaño de fuente con size = 2</font><br>
     <font size="3">tamaño de fuente con size = 3</font><br>
     <font size="4">tamaño de fuente con size = 4</font><br>
     <font size="5">tamaño de fuente con size = 5</font><br>
     <font size="6">tamaño de fuente con size = 6</font><br>
     <font size="7">tamaño de fuente con size = 7</font><br>
     </body>
</html>

El código anterior se vería así en el navegador:

tamaño de fuente con size = 1
tamaño de fuente con size = 2
tamaño de fuente con size = 3
tamaño de fuente con size = 4
tamaño de fuente con size = 5
tamaño de fuente con size = 6
tamaño de fuente con size = 7

Nota: Para el ejemplo se ha utilizado el Bloc de notas de Windows y el navegador Mozilla Firefox
-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Universidad de Murcia

Temas anteriores *
45.- Elementos de Estructuración de Texto <del></del>
44.- Elementos de estructuracion de Texto <></>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"
38.- Elementos de Estructuración de Texto "<cite></cite>"
37.- Elementos de estructuración de Texto "<var></var>"
36.- Elementos de estructuración de Texto "<kbd></kbd>

miércoles, 4 de febrero de 2009

45.- Elementos de Estructuración de Texto <del></del>

Continuamos con los elementos de estructuración de texto en html, el último de esta serie, esta etiqueta es utilizada para textos borrados.

código     : <del></del>
resultado: formato para escribir textos borrados

Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Estructuración de Texto</title>
  </head>
  <body>
     Texto normal <br>
     <del>Formato utilizado para los textos borrados</del>
     <br>
     </body>
</html>

El código anterior se vería así en el navegador:

Texto normal
Formato utilizado para los textos borrados

Nota: Para el ejemplo se ha utilizado el Bloc de notas de Windows y el navegador I Explorer 7
-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: conclase.net

Temas anteriores *
44.- Elementos de estructuracion de Texto <del></del>
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"
38.- Elementos de Estructuración de Texto "<cite></cite>"
37.- Elementos de estructuración de Texto "<var></var>"
36.- Elementos de estructuración de Texto "<kbd></kbd>
35.- Elementos de estructuración de Texto "<samp></samp>"
ventasonline

martes, 3 de febrero de 2009

44.- Elementos de Estructuración de Texto <></>

Continuamos con los elementos de estructuración (ya faltan menos) de texto en html, la etiqueta en esta oportunidad es para textos insertados.

código     : <ins></ins>
resultado: formato para escribir textos insertados


Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Estructuración de Texto</title>
  </head>
  <body>
     Texto normal <br>
     <ins>Formato utilizado para los textos insertados</ins>
     <br>
     </body>
</html>

El código anterior se vería así en el navegador:

Texto normal
Formato utilizado para los textos insertados

Nota: Para el ejemplo se ha utilizado el Bloc de notas de Windows y el navegador I Explorer 7
-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: Mozilla

Temas anteriores *
43.- Elementos de Estructuración de Texto <q></q>
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"
38.- Elementos de Estructuración de Texto "<cite></cite>"
37.- Elementos de estructuración de Texto "<var></var>"
36.- Elementos de estructuración de Texto "<kbd></kbd>
35.- Elementos de estructuración de Texto "<samp></samp>"
34.- Elementos de estructuración de Texto "<code></code>"centrovacacional

lunes, 2 de febrero de 2009

43.- Elementos de Estructuración de Texto <q></q>

Continuamos con los elementos de estructuración (ya faltan menos) de texto en html, tenemos la etiqueta para citas cortas, a diferencia de "blockquote" no muestra sangría.

código     : <q></q>
resultado: formato para escribir citas cortas


Pasemos al Código de ejemplo:
(He agregado un <br>, salto de línea en el código para poder ver el resultado en dos líneas).

<html>
  <head>
    <title>Estructuración de Texto</title>
  </head>
  <body>
     Texto normal <br>
     <q>Formato utilizado para escribir citas cortas <q> </q>
     <br>
     </body>
</html>

El código anterior se vería así en el navegador:

Texto normal
Formato utilizado para escribir citas cortas

Nota: Para el ejemplo se ha utilizado el Bloc de notas de Windows y el navegador I Explorer 7
-----------------------------------------------------------

Podéis encontrar más información sobre este tema en: wikibooks.org

Temas anteriores *
42.- Elementos de Estructuración de Texto <blockquote></blockquote>
41.- Elementos de estructuración de Texto <address></address>
40.- Elementos de estructuración de Texto <acronym></acronym>
39.- Elementos de Estructuración de "<abr></abr>" y "<abbr></abbr>"
38.- Elementos de Estructuración de Texto "<cite></cite>"
37.- Elementos de estructuración de Texto "<var></var>"
36.- Elementos de estructuración de Texto "<kbd></kbd>
35.- Elementos de estructuración de Texto "<samp></samp>"
34.- Elementos de estructuración de Texto "<code></code>"
33.- Elementos de estructuración de Texto "<dfn></dfn>

spainparkhome