Tutorial: Elementos semànticos HTML 5

  • Autor Autor gatsu
  • Fecha de inicio Fecha de inicio
G

gatsu

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
command la etiqueta <command> con su respectivo cierre trabaja con el elemento <menu>, para añadir un elemento al menu, pero
tambien puede trabajar en cualquier punto de una pagina para funcionar como un atajo de teclado. Este elemento cuenta con los atributos
siguientes:

Atributo icon. Este indica la ruta de una imagen que representara al comando con un icono.
Atributo checked. Si el comando es de tipo caja de seleccion(checkbox) o boton radio(radio button) indica si el comando esta marcado o no.
Atributo disabled. Establece si el comando esta activado o no.
Atributo label. Le da un texto al comando, el cual sera mostrado en la pagina.
Atributo title. Despliega una leyenda con un texto como descripcion como descripcion del comando.
Atributo type. Indica el comportamiento del comando, este puede ser el correspondiente a una caja de selecciòn (checkbox), comando simple (command) o un boton de radio.

los atributos globales para el manejo de eventos funcionan con <command>, el mas usado es el atributo onclick, el cual especifica una linea
simple de codigo javascript para ejecutar cuando se hace click.

Ejemplo:

<menu>
<li title="opcion 1" onclick="alert('opcion 1')">opcion 1</li>
<li title="opcion 2" onclick="alert('opcion 2')">opcion 2</li>
<li title="opcion 3" onclick="alert('opcion 3')">opcion 3</li>
</menu>



details y summary la etiqueta con cierre <details> funciona como un espacio desplegable y replegable. Trabaja junto con la etiqueta
<summary> y su respectivo cierre donde esta funciona como texto en forma de titulo sensible, el cual al hacer click en el, despliega u oculta
contenido colocado mediante otra etiqueta.

Ejemplo:

<details>
<summary> mi contenido </summary>
<p>contenido replegable </p>
</details>


dfn se usa la etiqueta con cierre <dfn> si en el contexto del contenido desea definir un termino. Simplemente hay que rodear al termino,
no a su significado, con las etiquetas <dfn> y </dfn>.

Ejemplo:

<p><dfn>HTML: </dfn>
lenguaje de marcado para la elaboracion de paginas web.
</p>

figure y figcaption usamos la etiqueta <figure> con su cierre si decidimos que es semanticamente importante enfatizar cualquier tipo
de imagen, no se afecta de ninguna manera la presentacion visual de esta. Opcionalmente puede utilizar un titulo descriptivo para la imagen
en cuestion con la etiqueta <figcaption> y su cierre.

Ejemplo:

<figure>
<figcaption> Dibujo de una pelota </figcaption>
<img src="pelota.jpg" width="300" height="500" />
</figure>


wbr la etiqueta <wbr> y su cierre indican dònde podria estar bien un salto de linea en una palabra demasiado larga. Esto aplica cuando
el navegador ajusta el texto al espacio disponible en el navegador, si encuentra al elemento <wbr> lo interpreta como una posible oportunidad
para hacer el salto de linea.

Ejemplo:

<p>
para explotar el poder de HTML 5 se debe aprender Java<wbr>Script y Css.
</p>

P.D. Amigos espero que les haya gustado. Saludos a Todos.
 
se agracede 🙂
 
agradecido con el tutorial,es bueno tener conocimientos de este lenguaje
 
Muchas gracias por el aporte
 
gracias,:encouragement::encouragement::encouragement:
 
thanks you 😀
 
Atrás
Arriba