Sistema Internet de Presidencia

• Inicio
• Pagina Intermedia
• Elementos HTML

Elementos HTML

ligas

• Liga sencilla
• Liga externa
• Liga con Scroll
• Liga con Ventana
• Liga con Tooltip

								<!-- Liga Sencilla -->

								<a href="#" title="Título descriptivo" >Texto de la liga</a>
							

								<!-- Liga Externa -->

								<a href="#" class="ext" title="Título descriptivo" >Texto de la liga</a>
							

								<!-- Liga para Scroll -->

								<a href="#videos" class="scroll" title="Título descriptivo" >Texto de la liga</a>
							

								<!-- Liga para Ventana -->

								<a href="#" class="ventana" title="Muestra Ventana" rel="caja_dialogo">Ver ventana</a>

								<div class="oculta" id="caja_dialogo">

								<div id="Ventana_de_Muestra">

								<h3>DEMO1</h3>

								<p>Esto es solo una prueba</p>

								</div>

								</div>
							

								<!-- Liga con tooltip -->

								<a class="tooltip_arriba" href="index.html" title="Pagina de Inicio" >Pagina de inicio</a>
							

Galerias

							<!-- Galeria -->

							<div class="galeria">

							<a href="imagenes/ejemplos/11.png"><img alt="Imagen de Muestra 1" src="imagenes/ejemplos/1.png" /></a>

							<a href="imagenes/ejemplos/22.png"><img alt="Imagen de Muestra 2" src="imagenes/ejemplos/2.png" /></a>

							<a href="imagenes/ejemplos/33.png"><img alt="Imagen de Muestra 3" src="imagenes/ejemplos/3.png" /></a>

							<a href="imagenes/ejemplos/44.png"><img alt="Imagen de Muestra 4" src="imagenes/ejemplos/4.png" /></a>

							<a href="imagenes/ejemplos/55.png"><img alt="Imagen de Muestra 5" src="imagenes/ejemplos/5.png" /></a>

							<a href="imagenes/ejemplos/66.png"><img alt="Imagen de Muestra 6" src="imagenes/ejemplos/6.png" /></a>

							<a href="imagenes/ejemplos/77.png"><img alt="Imagen de Muestra 7" src="imagenes/ejemplos/7.png" /></a>

							<a href="imagenes/ejemplos/88.png"><img alt="Imagen de Muestra 8" src="imagenes/ejemplos/8.png" /></a>

							</div>

							<!-- Fin Galerias -->
						

Imagenes

Imagenes con descripción

							<!-- Imagen con descripción -->

							<img class="descripcion" alt="Imagen de Muestra 1" src="imagenes/ejemplos/11.png" />

							<!-- Fin Imagen con descripción -->

						

Tabs

• Tab 1
• Tab 2
• Tab 3

HTML

							<!-- Tabs -->

							<ul class="tabs izquierda">

							<li><a id="tab1" href="#id_contenido1">Tab 1</a></li>

							<li><a id="tab2" href="#id_contenido2">Tab 2</a></li>

							<li><a id="tab3" href="#id_contenido3">Tab 3</a></li>

							</ul>

							<div id="id_contenido1" class="tab_contenido">

								Contenido del tab 1

							</div>

							<div id="id_contenido2" class="tab_contenido">

							Contenido del tab 2

							</div>

							<div id="id_contenido3" class="tab_contenido">

							Contenido del tab 3

							</div>

							<!-- Fin Tabs -->

						

Tablas

								<table class="orden renglones" summary="Esta tabla muesra un grupo de datos se pueden ordenar" >

								<thead>

								<tr>

								<th>Nombre</th>

								<th>Apellido</th>

								<th>Correo</th>

								</tr>

								</thead>

								<tbody>

								<tr>

								<td>Rogelio</td>

								<td>Argumedo</td>

								<td>royelio@gmail.com</td>

								</tr>

								<tr>

								<td>Edna</td>

								<td>González</td>

								<td>ed@yahoo.com</td>

								</tr>

								<tr>

								<td>Calli</td>

								<td>Arggon</td>

								<td>tenoch@calli.com</td>

								</tr>

								<tr>

								<td>Adriana</td>

								<td>Uribe</td>

								<td>arzate@sip.gob.mx</td>

								</tr>

								</tbody>

								</table>
							

videos

							<div class="video">

							<a title="video de.." href="http://www.youtube.com/v/j_g5RCrx1V4">

							<img alt="Imagen de Muestra 1" src="imagenes/ejemplos/11.png" />

							</a>

							</div>
						

Última modificación :
Sábado 9 de Junio de 2012, Rogelio Argumedo Uribe