You are on page 1of 5

Algunos elementos bsicos en html (para estructura)

Nota: este es el cdigo


bsico de la pgina all
estn las estructuras
elementales de inicio y
alguna que otra lista
<blockquote> es una
etiqueta que se usa en
textos grandes, posee su
correspondiente etiqueta
de cierre
<Aside>: es una etiqueta
que se usa para crear la
barra lateral de la
pgina algo asi como la
zona donde pones el men de la pgina
Ojo h1 es problemtico en algunos navegadores; para que sea vlido en
todos los navegadores es recomendable hacer un solo h1 para toda la pgina
web (ellos lo toman como el titulo mas importante)
Etiquetas para aadir imgenes
Figure. Se usa para aadir elementos independientes dentro de la pgina,
se usa para insertar elementos externos como imgenes, videos y dems,
figure posee par de cierre

nota: Esta es la estructura


que se usa para aadir
una imagen se
recomienda que sea
.jpg .gif .png

<figcaption>: posee par


de cierre- se usa para
aadir pie de imgenes y
se pone dentro del figure
<mark>: con par de cierre- se usa para resaltar texto, por ejemplo para
resaltar una busqueda
<em><em>: se usa en los textos y pone el seleccionado en cursiva y da un
resalte semantico

<strong><strong>: pode el texto en negrita y los buscadores lo usan para


caracterizar pginas web
<small> se usa para textos legales por ejemplo los derechos de uso de
instagram derechos reservados
Block level: son aquellos grupos de etiquetas que generan nuevas lneas para
su contenido, seguido de un grupo de aparte
Nota: no es tan importante el diseo que dan estas etiquetas (se
modificaran en css) sino su sentido semntico
Trabajando la apariencia con CSS

nota: lo que est en rojo


es un link a una hoja de
estilos, tomando el
directorio donde este el
archivo .CSS

En la carpeta de la pgina debera tener mi cdigo .css .js y html en carpetas


diferentes, adems de una carpeta img para las imgenes
nota: este es un cdigo
en CSS donde se aprecia
que se modifica el color de
la etiqueta body a un azul
ojo: hay que modificar
el CSS para que la
pgina se abra igual en
todos los navegadores

nota: el id es el
nombre de la etiqueta
en especifico para
modificar en CSS se
usaria el mismo
nombre presedido de
#

Modelo caja- contenedor

Hay principalmente dos tipos de etiqueta de acuerdo al espacio que ocupan

Block: ocupan el 100 del ancho de la pantalla


Inline: ocupan solo el espacio de su contenido (se ubican
automticamente una al lado de la otra)

Float: es una propiedad de css que pone a un elemento inline y adems obliga
a los elementos que tena por debajo a organizarse rodearle

nota: fjate que el cuadro


amarillo rodea al cuadro
verde, este ltimo es un
cuadro inline
No posee margin por eso
es que se ven sper
unidos

La propiedad paddin es la separacin existente entre el margen de un


elemento (ej: footer) con los objetos de su interior (texto, imgenes, etc.) se
mide en top, botton, right y left

nota: de esta forma se


aaden comentarios en
HTML5

<style><style>: se usa dentro del head de html5 para crear estilos CSS
particulares para mi pgina web en especfico (en el caso que desee usar un
estilo heredado y desease modificar algo sin editar la fuente) posee ms
prioridad de ejecucin que el archivo,css original
nota: asi se usan los estilos en lnea, que son tiles para modificar aquellas
cosas UNICAS dentro de la pgina que no podemos modificar en grupo se
debe usar poco porque despus es un problema tener estilos demasiado
nicos, es mejor usar genricos

hasta aqu termina el


video 7

You might also like