Trabajo de aplicación informatica pati muñoz

9
TRABAJO DE APLICACIÓN INFORMATICA NOMBRE: PATCIA MUÑOZ CURSO: 3° ADMINISTRACION CODIGS PHP PARA FUENTES COLORES Y TAMAÑO DE TEXTO 5.4 - Tamaño y Color de las fuentes de caracteres Utilidad En el apartado anterior se vio el modo de definir los distintos títulos de documento, mediante cabeceras . Estas son poco flexibles y predeterminadas. Existe otra etiqueta HTML que permite una más sencilla adaptación del tamaño de las fuentes y permite además modificar su color. Con esta podremos incluir texto resaltado en medio de una frase, con las cabeceras no es posible ya que estas introducen automáticamente un salto de línea detrás, y permitirá incluir párrafos de distintos tamaños o colores, proporcionando una mayor versatilidad y pudiendo crear efectos más espectaculares. La etiqueta que permite esto se llama FONT y presenta atributos que nos permiten modificar el tamaño y color del texto incluido entre la etiqueta de inicio y fin. <FONT SIZE=n> : Tamaño de la fuente El atributo SIZE permite indicar el tamaño de la fuente, su valor puede estar entre 1 y 7. Incrementándose de tamaño progresivamente desde 1, que es la fuente de menor tamaño, hasta 7 que la fuente de mayor tamaño. El texto normal equivale a la fuente de tamaño 3, por tanto los valores menores que 3 serán fuentes más pequeñas que el texto normal y las mayores que 3 serán de mayor tamaño. El tamaño también puede indicarse de forma relativa, indicando el incremento o detrimento a partir de la fuente base. Por defecto la fuente base será 3, por tanto si se indica como valor +1 la fuente será de tamaño 4. Existe una etiqueta que redefine la fuente por defecto, esta etiqueta es: <BASEFONT SIZE ...>

description

tarea

Transcript of Trabajo de aplicación informatica pati muñoz

Page 1: Trabajo de aplicación informatica pati muñoz

TRABAJO DE APLICACIÓN INFORMATICA

NOMBRE: PATCIA MUÑOZ

CURSO: 3° ADMINISTRACION

CODIGS PHP PARA FUENTES COLORES Y TAMAÑO DE TEXTO

5.4 - Tamaño y Color de las fuentes de caracteres

Utilidad 

En el apartado anterior se vio el modo de definir los distintos títulos de documento, mediante cabeceras. Estas son poco flexibles y predeterminadas.

Existe otra etiqueta HTML que permite una más sencilla adaptación del tamaño de las fuentes y permite además modificar su color.

Con esta podremos incluir texto resaltado en medio de una frase, con las cabeceras no es posible ya que estas introducen automáticamente un salto de línea detrás, y permitirá incluir párrafos de distintos tamaños o colores, proporcionando una mayor versatilidad y pudiendo crear efectos más espectaculares.

La etiqueta que permite esto se llama FONT y presenta atributos que nos permiten modificar el tamaño y color del texto incluido entre la etiqueta de inicio y fin.

<FONT SIZE=n> : Tamaño de la fuente El atributo SIZE permite indicar el tamaño de la fuente, su valor puede estar entre 1 y 7. Incrementándose de tamaño progresivamente desde 1, que es la fuente de menor tamaño, hasta 7 que la fuente de mayor tamaño. El texto normal equivale a la fuente de tamaño 3, por tanto los valores menores que 3 serán fuentes más pequeñas que el texto normal y las mayores que 3 serán de mayor tamaño.

El tamaño también puede indicarse de forma relativa, indicando el incremento o detrimento a partir de la fuente base. Por defecto la fuente base será 3, por tanto si se indica como valor +1 la fuente será de tamaño 4.

Existe una etiqueta que redefine la fuente por defecto, esta etiqueta es: <BASEFONT SIZE ...>

Los elementos de tamaño de fuentes pueden ser definidos para todo un documento, teniendo validez dentro de elementos tales como listas y formularios, pero no tendrán validez global en las tablas, debiendo definir cada una de las celdas al tamaño de fuente deseado.

Ejemplos de tamaños de fuentes

Inst. HTML Muestra Explicación

<FONT Muestra Obtendriamos en este caso texto de tamaño de fuente 2

Page 2: Trabajo de aplicación informatica pati muñoz

SIZE=2>Muestra</FONT>

<FONT SIZE=6>Muestra</FONT> Muestra Este texto es de tamaño de fuente 6

<FONT SIZE=-1>Muestra</FONT> Muestra Obtendriamos también en este caso texto de tamaño de

fuente 2, pero lo definiríamos de forma relativa: 3-1=2

<FONT SIZE=+2>Muestra</FONT> MuestraAsí definiríamos fuente de tamaño 6 de forma relativa: 3+2=5

<FONT SIZE=6> Muestra <FONT SIZE=1> Muestra </FONT> Muestra </FONT> Muestra Muestra Muestra

Se pueden combinar en una misma frase varios tamaños de fuentes

<FONT SIZE=4> Muestra <B> <I> < A HREF="http://www.uca.es"> Muestra </A>

</I> Muestra </B> </FONT>Muestra Muestra Muestra

Se pueden combinar con elementos de resalte e hiperenlaces

<BASEFONT SIZE=n> : Fuente por defecto Definirá el tamaño de la fuente que se considerará como base para definir los tamaños de fuente relativos.

Esta etiqueta no define el tamaño de la fuente por defecto, para el texto normal, y solo se usa para cálculos de tamaño de fuente relativos. La utilidad no es muy amplia, y se podría utilizar cuando en un documento en el que todos los tamaños estén definidos de forma relativa y se desee cambiar de forma global el tamaño de las fuentes.

Si no incluye esta etiqueta el valor base para estos cálculos es 3, con esta se puede variar, como se ve en el ejemplo.

Inst. HTML Muestra Explicación

<FONT SIZE=-2>Muestra</FONT>

<BASEFONT SIZE=5>

<FONT SIZE=-2>Muestra</FONT>

Muestra MuestraEl nuevo valor para el calculo del tamaño relativo será 6, notándose el efecto en el tamaño de las fuentes

<FONT COLOR=texto color ó rrvvaa> : Color de la fuente El atributo COLOR nos permite definir el color que tendrá el texto incluido entre las etiquetas de inicio y fin. Este atributo solo funciona en el Internet Explorer de Microsoft y en el Netscape   versión 2.0  o superior.

El modo de definir los colores es similar al explicado para los atributos de BODY, al que le remitimos si no le quedo claro.

Page 3: Trabajo de aplicación informatica pati muñoz

Este atributo puede ser definido de forma conjunta con el atributo SIZE, o de forma independiente, siendo atributos de la misma etiqueta. Si se define el atributo SIZE solo, el color del texto que define será el por defecto, si se define con la etiqueta COLOR solo, el tamaño será el de la fuente base.

Al igual que en el caso del tamaño de la fuente pueden ser utilizados junto con otros elementos del lenguaje HTML como listas y formularios y pueden ser utilizados conjuntamente con los elementos de resalte

El cambio de color no afectará al texto o elementos incluidos en un hiperenlace, utilizándose para estos el color por defecto definido en la etiqueta BODY.

Ejemplos de definición de colores de fuentes

Algunos ejemplos de la definición de colores de fuente podrían ser:

Inst. HTML Muestra Explicación

<FONT COLOR=FF00FF>Muestra</FONT> MuestraEl texto se mostrará de un color lila, al mezclar los colores rojo y azul.

<FONT COLOR=AQUA>Muestra</FONT> Muestra También se puede utilizar uno de los colores predefinidos.

<FONT SIZE=5 COLOR=red> Muestra </FONT> Muestra Se puede combinar con el

tamaño de fuente

<FONT COLOR=NAVY> Mue<FONT SIZE=4 COLOR=BLUE>str</FONT>a </FONT> Muestra

Se pueden combinar varios colores en una misma frase o palabra.

<H3> <FONT COLOR=81426E> Mu<I>es</I>tra </FONT> </H3> Muestra

Pueden ser utilizados junto con otros elementos de resalte como cabeceras, estilos físicos y lógicos, etc ...

CODIGOS HTML PARA FUENTES COLOR TAMAÑO DE TEXTO

Marcas de texto lógicas y tipográficas

HTML es un sistema de marcado cuya función es definir la estructura y aspecto de un documento. Debemos profundizar esta definición, que sin más aclaraciones no diría mucho, a fin de comprender mejor los conceptos de marcas lógicas y tipográficas. Una marca tipográfica tiene como función formatear visualmente un documento, es decir aplicarle negritas, cursivas, subrayarlo, etc.

Una marca lógica, por el contrario, tiene como función definir una estructura independientemente del aspecto. Es decir, independientemente del modo en que el navegador interpretará visualmente el marcado.

Page 4: Trabajo de aplicación informatica pati muñoz

Para comprender mejor esta diferencia, tomemos dos elementos que sirven para formatear texto:

<ADDRESS></ADDRESS>

Se trata de una marca lógica que representa la información "dirección" en el documento. Dicho de otro modo, cuando estamos ante una dirección, una dirección de correo electrónido o un número de teléfono, según las reglas del HTML, hay que insertar esta marca lógica.

<I></I>

Se trata de una marca tipográfica que indica que el texto comprendido en el elemento va en cursiva. Es, por tanto, una marca cuya función es dar un determinado aspecto al documento y no marcar una estructura.

Veamos ahora juntos cuál es el resultado visual de su utilización en el interno de un documento web:

[email protected]

[email protected]

Sin mirar la fuente del documento, ¿podrías averiguar qué texto ha sido formateado con ADDRESS y cuál con I?. Visualmente ambas marcas (la primera es ADDRESS y la segunda I) producen el mismo resultado (el texto en cursiva). Sin embargo, desde el punto de vista de la estructura del documento, sólo el primero (ADDRESS) indica que dentro hay una dirección, mientras que el segundo no proporciona ninguna información de este tipo.

La marca FONT y el nuevo estándar HTML 4

HTML 4 es el estándar que, desde hace casi dos años, rige las suertes del lenguaje de marcado más popular del mundo. Sin hacer juicios de valor sobre las novedades del nuevo estándar, queremos subrayar que el W3C ha desaconsejado el uso de la marca FONT en la formatación del texto en HTML. Así, los navegadores leen todavía esta marca, pero su uso está rigurosamente prohibido por el nuevo estándar. Según HTML 4, la formatación del texto corresponde exclusivamente a las hojas de estilo.

En esta lección no tendremos en cuenta las indicaciones del W3C y explicaremos el uso de las marcas clásicas del HTML 4. Para profundizar en el tema CSS, puedes consultar la sección Hojas de estilo de este sitio.

Formatear títulos de <H1> ad <H6>

La marca <Hn> (donde n puede ser cualquier número comprendido entre 1 y 6) se emplea para definir el estilo de los encabezados de la página, dándoles más o menos relieve según el número correspondiente. Como hemos señalado, los números van del 1

Page 5: Trabajo de aplicación informatica pati muñoz

al 6, siendo más importantes los números más bajos que los altos. Visualmente, esta diversa importancia se plasma en la diferente dimensión del texto, como en el siguiente ejemplo:

Además de definir el estilo de los encabezados, la marca <Hn> introduce separaciones de párrafo.

<FONT>

La marca tipográfica FONT es una de las más utilizadas y frecuentes en el actual web publishing. En la sección Impostar el fondo del documento (elemento BODY), hemos visto que el atributo TEXT da un color único a todo el texto del documento. La marca FONT tiene, en parte, una función similar, aunque es mucho más amplia y conceptualmente diversa.

La marca FONT se emplea para formatear el tipo y tamaño del texto en algunos puntos del documento específicos. En realidad, si la marca FONT abriera y cerrara el documento, todo el texto comprendido dentro quedaría formateado tal y como estuviera indicado. Sin embargo, conceptualmente la marca FONT ha sido concebida para definir partes limitadas de texto. Por otro lado, mientras TEXT determina tan sólo en color del texto, la marca FONT puede definir el tipo utilizado, así como su tamaño y color.Aquí tienes la sintaxis correcta de la marca:

<FONT FACE="arial" SIZE=5 COLOR=red>Tipo para formatear</FONT>

El atributo FACE="arial" indica el tipo que se visualizará; SIZE=5 el tamaño del tipo, que puede estar comprendido entre 1 y 7 (mayor dimensión cuanto más cercano al 7); COLOR=red indica el color del texto (que puede expresarse asimismo en valores hexadecimales).<B>, <I>, <U>

<B>, <I>, <U> son tres de las marcas de formatación tipográfica más usadas del HTML. Todas ellas deben constar de apertura y cierre:

<B> Texto en negrita </B>El texto comprendido entre estas marcas queda formateado en negrita (la B corresponde al inglés BOLD).

<I> Texto en cursiva </I>El texto comprendido entre estas marcas queda formateado en cursiva (la I corresponde al inglés ITALIC)

<U> Texto subrayado </U>El texto comprendido entre estas marcas queda subrayado aun sin ser un enlace (la U corresponde al inglés UNDERLINE).

Existe también la marca STRIKE para el texto tachado:<STRIKE> Texto tachado </STRIKE>

<SUP> y <SUB>

Page 6: Trabajo de aplicación informatica pati muñoz

Estas dos marcas tipográficas crean respectivamente superíndices(SUP), en los que el texto está en posición ligeramente superior respecto al texto normal, y subíndices (SUB), posición ligeramente inferior respecto al texto normal. Es posible anidar diversas marcas a fin de obtener efectos de superposición sucesiva. Estos elementos se usan, sobre todo, en las notas o en las fórmulas matemáticas.La sintaxis correcta es:

HTMLpoint <SUP>©</SUP> es una marca registrada

HTMLpoint <SUB>©</SUB> es una marca registrada

Texto preformateado

HTML lee el texto, obviamente, de izquierda a derecha y, sin ningún tipo de formatación, cambia de renglón al final de cada línea sin interrupciones. La formatación que examinamos en esta lección indica al navegador dónde saltar de línea, qué tipo de carácter utilizar, qué palabras resaltar, etc. A menudo, sin embargo, hay que importar un documento creado con un editor de texto normal sin formatear, tal y como ha sido creado. Para ello, HTML prevé lasmarcas de texto preformateado, las cuales no leen ni interpretan algunas marcas de HTML ni los caracteres especiales: 

<XMP> Texto para formatear </XMP>

<PRE> Texto para formatear </PRE>

Ambas marcas tienen la misma función, aunque el estándar de HTML 4 prevé el uso de XMP y no de PRE.

Breve descripción de las marcas lógicas

Al inicio de la lección, hemos definido la diferencia entre marcas tipográficas y lógicas. Ahora citamos las marcas lógicas más interesantes y su correspondiente utilización en HTML:

<ADDRESS>Se emplea para indicar información relacionada con cualquier tipo de dirección (e-mail, teléfono, etc.).

<BLOCKQUOTE>Se usa en las citas textuales que ocupan más de dos o tres líneas.

<CITE>Indica la fuente de la cita.

<CODE>Se utiliza para formatear líneas de códigos de programación.

Page 7: Trabajo de aplicación informatica pati muñoz

<DFN>El texto comprendido dentro es una definición.

<EM>Da énfasis al texto comprendido dentro.

<KBD> y <SAMP>Poco utilizados. Indican cosas que el ordenador debería decir al usuario y viceversa, según un típico concepto de Unix.

<STRONG>Denota énfasis fuerte.

<VAR>Asociado a CODE, indica las variables de programación.