Etiquetas basicas producto 10
12
Etiquetas básicas de html Alison Marinone Macfarland 9A #11
-
Upload
marinonema2 -
Category
Internet
-
view
104 -
download
0
description
Etiquetas basicas
Transcript of Etiquetas basicas producto 10
Etiquetas básicas de html
Alison Marinone Macfarland 9A #11
Investigar las siguientes etiquetas y atributos
ImagenLa etiqueta <IMG>
La etiqueta <IMG> te servirá para situar imágenes en una página. Es una
etiqueta "verdadera", pues no tiene etiqueta de cierre:
<IMG>
La etiqueta <IMG> requiere un origen de datos obligatorio dado por el atributo SRC=. Indica la imagen en cuestión:
<IMG SRC="bander.gif">
Tan sólo el código anterior es necesario para añadir una imagen a tu página, mostrando la imagen situada en el mismo directorio del documento HTML.
A la etiqueta <IMG> se le pueden añadir varios atributos para controlar la manera en que un navegador administra una imagen. Estos atributos son los siguientes:
width="x" Permite al navegador predeterminar el ancho, en pixles, que tendrá tu
imagen. height="x" Junto con el atributo width, el navegador puede preparar el espacio
necesario para tu imagen antes de que se muestre. border="x" Para añadir o eliminar un borde, donde la x será un valor numérico.
align="xxx" Puedes alinear una imagen horizontal y/o verticalmente en una página usando este atributo.
alt="descripción_de_la_imagen" El atributo alt te permite describir la imagen para los navegadores de sólo texto, así como etiquetar la imagen antes de que se cargue en una
página. hspace="x" horizontal space, se usa para añadir espacio vacío, con un valor numérico, en
la coordenada horizontal de una imagen. vspace="x" vertical space, controla el espacio de la imagen en las coordenadas verticales.
BodyEsta sesión examina algunos atributos importantes de la etiqueta <BODY>. Estos
atributos de control de las propiedades del documento en su conjunto. Algunas de estas propiedades son:
TEXT: especifica el color del texto normal en una página
LINK: determina el color de enlace VLINK: determina el color del enlace que ha sido visitado ALINK: especifica el color del vínculo cuando se hace clic
BGCOLOR: controla el color de fondo del documento BACKGROUND : nos permite utilizar una imagen como fondo de la página.
Encabezados
Fuentes 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.
TablasAdemás de los atributos específicos de cada celda o línea, las tablas pueden ser adicionalmente formateadas a partir de los atributos que nos ofrece la propia etiqueta <table>. He aquí aquellos que pueden parecernos en un principio importantes:
align Alinea horizontalmente la tabla con respecto a su entorno.
background Nos permite colocar un fondo para la tabla a partir de un enlace a una imagen. bgcolor Da color de fondo a la tabla.
border Define el número de pixels del borde principal. bordercolor Define el color del borde.
cellpadding Define, en pixels, el espacio entre los bordes de la celda y el contenido de la misma. cellspacing Define el espacio entre los bordes (en pixels). height Define la altura de la tabla en pixels o porcentaje.
width Define la anchura de la tabla en pixels o porcentaje.
Los atributos que definen las dimensiones, height y width, funcionan de una manera análoga a la de las celdas tal y como hemos visto en el capitulo anterior. Contrariamente, el atributo align no nos permite justificar el texto de cada una de las
celdas que componen la tabla, sino más bien, justificar la propia tabla con respecto a su entorno. Vamos a poner tres ejemplos de alineado de tablas, centradas, alineadas a la derecha y a la izquierda.
Ejemplo de tabla centrada
Esta tabla está centrada (aling="center"). Solo tiene una celda. Este sería un texto cualquiera colocado al lado de una tabla centrada
Ejemplo de tabla alineada a la derecha
Esta tabla está alineada a la derecha (aling="right"). Solo tiene una celda.Para que se vea el efecto de alineado a la tabla debemos colocar un texto al lado y el texto rodeará la tabla, igual que ocurría con las imágenes alineadas a un lado.
Ejemplo de tabla alineada a la izquierda
Esta tabla está alineada a la izquierda (aling="left"). Solo tiene una celda.Para que se vea el efecto de alineado a la tabla debemos colocar un texto al lado y el texto rodeará la tabla, igual que ocurría con las imágenes alineadas a un lado.
Hipervínculo
Dentro de una página web, los hipervínculos son las palabras, párrafos o imágenes que al darles click, te llevarán a otro lugar, ya sea a otra página, o a una sección en específico dentro de la misma página; desempeñan una función muy útil, por ello saber cómo aprender a programar
hipervínculos a la hora de crear un sitio web es muy importante.
Otra de las características que tienen los hipervínculos es que al pasar el cursor sobre ellos, el ícono del cursor cambia y se convierte en una mano.
Cómo crear un hipervínculo:
Para programar HTML, los hipervínculos se indican con la etiqueta <a>.
Dicha etiqueta <a> deberá incluir el atributo href para especificar el destino del hipervínculo, y luego, como todas las etiquetas de HTML, se deberá cerrar de la manera </a> para indicar el fin del texto o de la imagen que contiene el hipervínculo.
Entonces, el hipervínculo en HTML luce de la siguiente manera:
<a href=”dirección del sitio”>Texto del Hipervínculo</a>
Ejemplo:
<a href=www.basekit.com.mx>BaseKit México</a>
Hipervínculos dentro de una misma página:
Para crear un hipervínculo que vaya a una sección dentro de la misma página, debemos hacer uso del atributo “id”. El título de la sección a la
que queramos ir deberá tener este atributo para que después podamos crear un hipervínculo hacia ella.
Por ejemplo, el título luciría así:
<h2 id="conclusion">Conclusión del Debate</h2>
PárrafoHTML considera que los párrafos son bloques de texto. Los navegadores hacen
lo posible para adaptar el contenido de los párrafos a la ventana, a menos que los atributos NOWRAP o NOBR estén explícitamente especificados.
Dentro de un párrafo, todos los espacios, tabuladores y saltos de línea cuentan como un espacio simple.
Para colocar textos en bloques, se utiliza el par de etiquetas <p> y </p>. Esta
etiqueta puede incluir cualquiera de los atributos mencionados anteriormente.
Los saltos de línea (saltar de una línea a la siguiente) se crean usando la etiqueta <br/>.
La etiqueta <hr> se utiliza para insertar una línea horizontal.
Texto
Para indicar atributos del texto (negrilla, subrayado, etc...) tenemos varias etiquetas. Algunas de ellas no son reconocidas por determinados navegadores de Internet, es por ello que segun el navegador que este vd. utilizando, verá el resultado
correctamente o no.
size = valor Da al texto un tamaño en puntos determinado. size = + / - valor Da al texto un tamaño tantas veces superior (+) o inferior (-) como indique el valor. color = "codigo de color" Escribe el texto en el color cuyo codigo se especifica. face = "nombre de font" Escribe el texto en el tipo de letra especificado. Si este tipo de letra no existe en el ordenador que "lee"
la pagina se usara el font predeterminado del navegador.
Bibliografía http://www.duiops.net/curso/atribimg.htm
http://www.desarrolloweb.com/articulos/629.php
http://www.basekit.com.mx/basekiteca/etiquetas-html-para-crear-hipervinculos
http://www.webtaller.com/manual-html/atributos-texto.php
http://www2.uca.es/serv/sc/manual-html/font.htm
