Modelo HTML { básico }

Aquí se muestra lo que podemos obtener al emplear las etiquetas HTML que con más frecuencia se utilizan en el desarrollo de páginas web.

Párrafos

Lorem ipsum dolor sit amet, Esto es un enlace adipiscing elit. Esto está con enfatizado doble Nullam dignissim convallis est. Quisque aliquam. Esto está con enfatizado simple Donec faucibus. Nunc iaculis suscipit dui. Esto es una potencia: 28 = 256. Aquí tenemos el sulfato de aluminio: Al2(SO4)3. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. y esto es una cita (That’s a citation). Subrayado. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Esto es un texto grande. Integer nisl purus,Esto es pequeño consequat at, commodo vitae, feugiat in, Y esto está escrito como un teletipo, todas las letras ocupan lo mismo. Morbi imperdiet augue quis tellus.

HTML and CSS are our tools. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.
Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. To copy a file type Código y variable. Dinner’s at 5:00. Let’s make that 7. This línea tachada has been struck.


Niveles de títulos

Encabezado 1

Encabezado 2

Encabezado 3

Encabezado 4

Encabezado 5
Encabezado 6

Tipos de Listas

Listas de definición

Tetraedro
Y su definición es: es un poliedro de cuatro caras. Con este número de caras ha de ser un poliedro convexo, y sus caras triangulares, encontrándose tres de ellas en cada vértice. Si las cuatro caras del tetraedro son triángulos equiláteros, iguales entre sí, el tetraedro se denomina regular.
Homotecia:
Es una transformación afín que, a partir de un punto fijo, multiplica todas las distancias por un mismo factor.

Lista ordenada

  1. List Item 1
  2. List Item 2
    1. Nested list item A
    2. Nested list item B
  3. List Item 3

Lista desordenada


Tabla

Cabecera de la tabla
Columna 1 Columna 2 Columna 3
celda 11 celda 12 celda 13
celda 21 celda 22 celda 23
celda 31 celda 32 celda 33


Texto preformateado

Tipográficamente no es lo mismo texto preformateado que código. Diferencias:

Preformato

Hay veces que necesitamos escribir texto tal cual aparece en ciertos documentos, con espacios y forma idénticos como este ejemplo:

“Lorem Ipsum es simplemente el texto de relleno de las imprentas.
	Al contrario del pensamiento popular,
	el texto de Lorem Ipsum no es simplemente texto aleatorio.
	Tiene sus raices en una pieza clásica de la literatura del Latin,
	que data del año 45 antes de Cristo,
	haciendo que este adquiera mas de 2000 años de antiguedad.
	La primera linea del Lorem Ipsum, "Lorem ipsum dolor sit amet..",
	viene de una linea en la sección 1.10.32
		

Código

Otras veces, necesitamos poner fragmentos de código y tenemos dos opciones: escribir código en la misma línea como por ejemplo: var pageTracker = _gat._getTracker("UA-953-1"); o en bloques de párrafo, respetando sangrías y espacios en blanco, como aquí:

	.contenedor {
		width: 640px;
		margin: 0 auto;
		padding: 20px;
		background: #fffaf4;
		border: 1px solid #dfdfdf;	
		text-align: left;
		}
		

Tabulaciones

En ocasiones necesitamos tabular (sangrar) un párrafo, para esto utilizaremos la etiqueta <blockquote> como puede observarse en el siguiente párrafo:

The X-48 Hybrid Wing Body, an F/A-18 used as an advanced systems testbed, a supersonic boundary layer transition experiment and gauging the effect of sonic booms on large structures—those are just some of the flight research projects being conducted by the Aeronautics Research Mission Directorate at NASA's Dryden Flight Research Center in 2011 in support of NASA aeronautics research goals.

http://www.nasa.gov/


Imágenes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ac sollicitudin odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque justo tortor, cursus at molestie in, volutpat at libero.escher Nam at est velit, nec faucibus odio. Ut orci lorem, venenatis et viverra vel, bibendum et velit? Vivamus arcu enim, convallis in adipiscing et, fermentum vel urna. Donec ante turpis, fermentum at tincidunt non, egestas ac neque! Curabitur dictum lobortis ante, sit amet feugiat dolor rutrum eu. Etiam fermentum tincidunt justo eget semper. Nam convallis magna quis nunc dictum pharetra. Donec egestas magna non risus suscipit tristique. Aenean non justo nec diam accumsan faucibus vel eu quam. Phasellus et turpis nibh. Etiam sed urna non mi tempor consectetur. Cras a lacus quam. Suspendisse pretium, neque eu venenatis consectetur, nisi velit euismod dui, ac cursus dolor orci at nulla. Praesent luctus nibh in velit convallis a placerat ante cursus.

escher

Vivamus eget mi elit, in hendrerit augue. Vivamus vestibulum leo ut nisi feugiat varius. Donec placerat tincidunt ornare. Phasellus ut eleifend lectus. Maecenas porttitor lacinia commodo. Etiam at nunc leo; vel vehicula enim. Donec a ligula odio. Pellentesque velit mi, euismod convallis auctor non, viverra at felis. Ut blandit vehicula lectus, quis porttitor est tincidunt lobortis? Nam ultrices laoreet nisl ut venenatis.

Phasellus tincidunt pulvinar venenatis. Aenean felis mauris; bibendum ac vestibulum ut, lobortis eget est. Nunc ipsum nibh, auctor congue dapibus vitae, ultricies sit amet enim. Nam risus augue, sollicitudin nec pretium non, tincidunt nec mauris? In placerat justo eget turpis mattis eleifend. Maecenas viverra metus at ipsum consequat vel aliquet neque laoreet. Sed varius, augue molestie pellentesque eleifend, arcu metus vulputate nisi, in semper nulla mauris et turpis? Praesent eros magna, accumsan ut convallis non, adipiscing quis leo. Aenean arcu tellus, vulputate a fringilla laoreet, eleifend at arcu. Maecenas elit dolor, ullamcorper vitae hendrerit id, ullamcorper ut ligula.

creative commons

 

Valid XHTML 1.0 Strict ¡CSS Válido!