HTML5 Tutoriales básicos

HTML5 API

HTML5 Medios

HTML5 Gráficos

HTML5 Admite el navegador

Puedes hacer que algunos navegadores más antiguos (que no admiten HTML5）Admite HTML5.

HTML5 Admite el navegador

Los navegadores modernos admiten HTML5.

Además, todos los navegadores, incluyendo los antiguos y los más nuevos, manejan automáticamente los elementos no reconocidos como elementos en línea.

Por lo tanto, puedes "Enseñar" El navegador maneja "Desconocido" los elementos HTML.

Incluso puedes enseñar a IE6 　(Windows XP 2001) El navegador maneja los elementos HTML desconocidos.

Procesa HTML5 El elemento se define como un elemento de bloque

HTML5 definido 8 Un nuevo elemento semántico (semantic) de HTML. Todos estos elementos son elementos de bloque.

Para que los navegadores antiguos muestren estos elementos correctamente, puedes establecer el valor de la propiedad CSS display en block:

Ejemplo

<html>
<head>　
<meta　charset="utf-8">　
<título>Base Tutorial Network (oldtoolbag.com)</title>　
</head>
<body>
encabezado, sección, pie de página, lado, navegación, principal, artículo, figura {
　　　　display: block;　
}
</body>
</html>

Ver aquí ‹/›

Agregar elementos personalizados a HTML

Puedes agregar elementos personalizados a HTML.

Los elementos personalizados añadidos a HTML en este ejemplo, y se define el estilo para este elemento, el nombre del elemento es <myLabel> :

Ejemplo

<!DOCTYPE html>
<html>
<head>
<meta　charset="utf-8">　
<título>Agregar nuevos elementos a HTML (oldtoolbag.com)</title>
<script>
　　　　document.createElement("myLabel")
</script>
<estilo>
myLabel{
　　　　display: block;
　　　　fondo-color: #ddd;
　　　　margen:　50px;
　　　　fuente-tamaño:　30px;
}
</estilo>　
</head>
　
<body>
　
<h1>Mi primer HTML5título</h1>
　
<p>Mi primer HTML5párrafo.</p>
　
<myLabel>Mi primer elemento personalizado</myLabel>
　
</body>
　　</html>

Ver aquí ‹/›

La declaración de JavaScript document.createElement("myLabel") es agregar nuevos elementos para el navegador IE.

Hacer que el navegador IE sea compatible con html5navegadores

Puedes usar el método anterior para agregar HTML5 elementos, pero:

Internet Explorer 8 y versiones anteriores de IE no admiten la forma anterior.

Podemos usar el "HTML5 Habilitar JavaScript", " shiv" para resolver este problema:

<!--[if　lt　IE　9]>
　　<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<![endif]-->

El código anterior es un comentario, su función es agregar comentarios en los navegadores IE de versiones inferiores a IE9 Al leer html5.js y analizarlo.

Atención:Los usuarios domésticos deben usar la biblioteca de recursos estáticos de este sitio (La biblioteca de recursos de Google no es estable en China):

<!--[if　lt　IE　9]>
　　<script　src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->

Para el navegador IE html5El shiv es una buena solución.html5shivPrincipalmente resuelve HTML5Los nuevos elementos propuestos no son compatibles con IE6-8Identificación, estos nuevos elementos no pueden envolver elementos hijos como nodos padre y no pueden aplicar estilos CSS.

Solución perfecta de Shiv

Ejemplo

<!DOCTYPE html>
<html>
<head>
<meta　charset="utf-8">
<title>Renderizar HTML5</title>
　　<!--[if　lt　IE　9]>
　　<script　src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
　　<![endif]-->
</head>
　
<body>
　
<h1>Mi primer artículo</h1>
　
<article>
Red de tutoriales básicos (oldtoolbag.com) ¡Aprende lo básico, ¡y podrás ir más lejos!!
</article>
　
</body>
</html>

Ver aquí ‹/›

html5El código de referencia de shiv.js debe colocarse dentro del elemento <head>, porque los navegadores IE interpretan HTML5 Primero debe cargar este archivo al agregar nuevos elementos SVG.

HTML5 SVG en línea HTML5 Tutoriales