Mostrando entradas con la etiqueta HTML. Mostrar todas las entradas
Mostrando entradas con la etiqueta HTML. Mostrar todas las entradas

Coger datos de dentro de un elemento HTML con JavaScript

var parrafo = document.getElementById('p1');
var contenido = parrafo.innerHTML;


por ejemplo:

si tienes un:             <p id="p1">hola</p>
en la variable contenido tienes:          hola

Listas de definiciones en html

<dl>
<dt>Aquí va el término que definiremos</dt>
<dd>Y aquí dentro irá la definición propiamente dicha.</dd>
</dl>
<dl>
<dt>Aquí va la segunda definición</dt>
<dd>Y aquí dentro irá la segunda definición, separada automáticamente de la anterior.</dd>
</dl>

Listas html

<ul>
<li type="circle">Esto es un tipo de punto.</li>
<li type="square">Este es otro.</li>
<li type="disc">Y este es otro diferente.</li>
</ul>


Así se mostraría:
  • Esto es un tipo de punto.
  • Este es otro.
  • Y este es otro diferente.

Listas numéricas en html

<ol>
<li value="20">Este será el número 20. </li>
<li>Este será el 21. </li>
<li> Este será el 22. Y así sucesivamente. </li>
</ol>

JavaScript y HTML

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function fun(){
var formulario = document.getElementById("nom");
alert(formulario.value);
}
</script>
</head>

<body>
<noscript>
<p>Bienvenido a Mi Sitio</p>
<p>La página que estás viendo requiere para su funcionamiento el uso de JavaScript.
Si lo has deshabilitado intencionadamente, por favor vuelve a activarlo.</p>
</noscript>
<form name ="nombre" action="" method="" >
Nombre <br/>
<input type="text" id="nom" value="" /><br/>
<input id="submit_button" type="submit" value="Enviar" onclick="fun()"/>
</form>
</body>
</html>

Video html

<video width="100%" controls>
  <source src="video.mp4" type="video/mp4">
 
</video>

Audio en html

<audio src="cancion.mp3" controls></audio>

Menu en HTML y CSS

Menu que se desplaza con el movimiento de la página en HTML y CSS


html:

<div id="izquierda2">
<h3>Menu</h3>
<ul>
<li><a href="index.html" title="Inicio">Inicio</a></li>
<li><a href="Socios.html" title="Socios">Socios</a></li>
<li><a href="Trabajamos.html" title="Trabajamos en">Trabajamos en</a></li>
<li><a href="Participar.html"title="¿Qué puedes hacer tú?">¿Qué puedes hacer tú?</a></li>
<li><a href="Imagenes.html" title="Más imágenes">Más imágenes</a></li>
</ul>
</div>


CSS:

#izquierda2{
float: left; width: 15%; font: 8pt Verdana; text-align: left;

position: fixed;
}


Código para que se reconozcan los acentos en una página

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Etiquetas html

<ol>  Hacer una lista ordenada.
<ul>         Hacer una lista sín orden alguno.
<dl>         Hacer una lista descriptiva.

<table>
Definir el espesor del borde de una tabla.
Tamaño del relleno de cada celda de la tabla.
Separación entre celdas de una tabla.
Especificar los bordes que serán visibles de la tabla.
Visualizar solo las líneas horizontales de una tabla.
Especificar el ancho de la tabla.
<tr>
Alinear horizontalmente el contenido de las celdas de una fila.
Alinear verticalmente el contenido de las celdas de una fila.
<td>
Alinear horizontalmente el contenido de una celda.
Alinear verticalmente el contenido de una celda.
Agrupamos un número de celdas horizontalmente.
Agrupamos un número de celdas verticalmente.


<h1>...<h6> Títulos de diferentes tamaños.
<p> Escribir un párrafo.
<!--> Poner un comentario en el código.
<br> Para hacer un salto de línea.
<hr> Dibujar una línea horizontal.


<b> Texto en negrita.
<big> Texto grande.
<em> Texto enfatizado.
<i> Texto en itálica.
<small> Texto pequeño.
<strong> Texto fuerte.
<sub> Texto por debajo.
<sup> Texto por encima.
<ins> Texto subrayado.
<del> Texto tachado.
<tt> Texto teletipo.


<frameset>
Definir marcos verticales.
Definir marcos horizontales.
<frame>
División de marcos sin bordes.
Uso de márgenes dentro de los marcos.
Marcos fijos que no permiten cambiar su tamaño.
Uso de la barra de desplazamiento dentro de los marcos.

<noframes>

En caso que el navegador del usuario no soporte marcos.
<iframe>
Alinéamos un iframe a la derecha de la página.
Mostrar un iframe sín los bordes.
Definir la altura del iframe a nuestro gusto.
Definir el ancho del iframe.
Mostrar un iframe sín las barras de desplazamiento.

Listas ordenadas HTML

<ol>
  <li>primero</li>
  <li>segundo</li>
  <li>tercero</li>
</ol>

añade mas   <li>...</li>  para mas elementos

Enlace a correo en HTML

<a href="mailto:correo@electronico_enlazado.com">
correo@electronico_enlazado.com
</a>

Código para meter texto dentro de una caja en el blog

<div align="left"><div style="background: #c8e6dc;  border: 5px double #b7a6d0; padding: 5px; width: 550px;">">Aquí va lo que quieres que este dentro de la caja</div></div>


div align="left"><div style="background: #c8e6dc;  border-top: 2px dotted #b7a6d0; border-right: 2px dotted #b7a6d0; border-bottom: 2px dotted #b7a6d0; border-left: 6px solid #68318f; padding: 5px; width: 550px;">Aquí va lo que quieres que este dentro de la caja</div></div>