HTML | DIRECCIÓN |
---|---|
Notas básicas de HTML | Conceptos básicos de HTML--muy detallado--cero conceptos básicos--simple y fácil de entender_blog de ddddddyu-blog de CSDN |
Notas avanzadas de HTML5 | Notas avanzadas de HTML5 - Súper detalladas - Concisas y fáciles de entender_Blog de ddddddyu-Blog de CSDN |
1 HTML5 nuevo contenido
- Etiquetas semánticas añadidas
- Se agregaron etiquetas de audio y video.
- Nuevo tipo de entrada
- Atributos de formulario agregados
HTML5 generalizado agrega:
Etiquetas semánticas
almacenamiento local
Compatibilidad
2D, 3D
animación, transición
Características de CSS3
Rendimiento e Integración
2 Agregar etiquetas semánticas
header ---头部标签
nav ---导航标签
article ---内容标签
section ---块级标签
aside ---侧边栏标签
footer ---尾部标签
3 Agregar etiquetas de audio y video
Respectivamente audio audio y video video
Formatos de audio compatibles con audio
parámetros de audio
<audio src="media/music.mp3" autoplay="autoplay" controls="controls"></audio>
Atributos | valor | describir |
---|---|---|
auto-reproducción | auto-reproducción | Si está presente, el audio se reproduce tan pronto como esté listo |
control S | control S | Si está presente, mostrar los controles al usuario, como un botón de reproducción |
bucle | bucle | Si está presente, reinicia la reproducción cada vez que finaliza el audio |
origen | URL | La url del audio a reproducir. |
La etiqueta de video video actualmente admite tres formatos
sintaxis y atributos de video
<video src="./media/video.mp4" controls="controls"></video>
Atributos | valor de atributo | ilustrar |
---|---|---|
auto-reproducción | auto-reproducción | El video está listo para reproducirse automáticamente ( Google Chrome necesita agregar silenciado para resolver el problema de reproducción automática ) |
control S | control S | Mostrar los controles de reproducción al usuario |
ancho | píxeles | Establecer el ancho del jugador |
altura | píxeles | Establecer la altura del jugador |
bucle | bucle | Si continuar reproduciendo el video después de reproducirlo, reproducción en bucle |
precarga | automático (precargar video) ninguno (no se debe cargar el video) | Especifica si precargar el video (ignore esta propiedad si la reproducción automática está disponible) |
origen | URL | la dirección de la URL del video |
póster | lmgurl | Cargando imagen de la pantalla de espera |
apagado | apagado | Silenciar reproducción |
4 Tipo de etiqueta de entrada agregado
- Importante recordar: número tel buscar estos tres
5 Atributos de formulario agregados
- Puede modificar el color de la fuente en el marcador de posición mediante la siguiente configuración
input::placeholder {
color: red;
}