HTML5 Manual Básico

HTML5 API

HTML5 Mídia

HTML5 Gráficos

HTML5 O suporte do navegador

Você pode fazer alguns navegadores mais antigos (não suportam HTML5）Suporte HTML5.

HTML5 O suporte do navegador

Os navegadores modernos suportam o HTML5.

Além disso, todos os navegadores, incluindo os antigos e os mais novos, tratam automaticamente os elementos não reconhecíveis como elementos inline.

Por isso, você pode "ensinar" processado pelo navegador "desconhecido" elementos HTML.

Até mesmo você pode ensinar o IE6 　(Windows XP 2001) processado pelo navegador para elementos HTML desconhecidos.

O HTML5 O elemento é definido como um elemento de bloco

HTML5 definido 8 Um novo elemento de semântica HTML. Todos esses elementos são elementos de bloco.}}

Para que os navegadores antigos possam exibir esses elementos corretamente, você pode definir a propriedade CSS display como block:

Exemplo

<html>
<head>　
<meta　charset="utf-8">　
<title>Site de tutoriais básicos (oldtoolbag.com)</title>　
</head>
<body>
header, section, footer, aside, nav, main, article, figure {
　　　　display: block;　
}
</body>
</html>

Teste para Ver ‹/›

Adicionar elementos personalizados ao HTML

Você pode adicionar elementos personalizados ao HTML.

O exemplo adiciona elementos personalizados ao HTML e define estilos para esses elementos, o nome do elemento é <myLabel> :

Exemplo

<!DOCTYPE html>
<html>
<head>
<meta　charset="utf-8">　
<title>Adicionar novos elementos ao HTML (oldtoolbag.com)</title>
<script>
　　　　document.createElement("myLabel")
</script>
<style>
myLabel{
　　　　display: block;
　　　　background-color: #ddd;
　　　　padding:　50px;
　　　　font-size:　30px;
}
</style>　
</head>
　
<body>
　
<h1>Meu primeiro HTML5título</h1>
　
<p>Meu primeiro HTML5parágrafo.</p>
　
<myLabel>Meu primeiro elemento personalizado</myLabel>
　
</body>
　　</html>

Teste para Ver ‹/›

A sentença JavaScript document.createElement("myLabel") é para adicionar novos elementos ao navegador IE.

para que o navegador IE suporte o html5navegadores

Você pode usar o método acima para adicionar HTML5 elementos, mas:

Internet Explorer 8 e versões mais antigas do IE não suportam a maneira acima.

Podemos usar o "HTML5 Habilitando JavaScript", " shiv" para resolver esse problema:

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

O código acima é um comentário, cujo propósito é adicionar comentários no navegador IE cuja versão é menor que IE9 ao ler html5.js e analisá-lo.

Atenção:Os usuários domésticos devem usar o repositório de recursos estáticos deste site (o repositório de recursos do Google é instável no Brasil):

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

Para o navegador IE html5O shiv é uma solução boa.html5shivPrincipais soluções para o HTML5Os novos elementos propostos não são suportados pelo IE6-8Os novos elementos propostos não podem ser empacotados como nós filhos e não podem aplicar estilos CSS.

Solução perfeita para o Shiv

Exemplo

<!DOCTYPE html>
<html>
<head>
<meta　charset="utf-8">
<title>Renderização de HTML5</title>
　　<!--[if　lt　IE　9]>
　　<script　src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
　　[endif]-->
</head>
　
<body>
　
<h1>Meu Primeiro Artigo</h1>
　
<article>
Site de Tutorial Básico (oldtoolbag.com) —— Aprenda os fundamentos, e você pode ir mais longe !!
</article>
　
</body>
</html>

Teste para Ver ‹/›

html5O código de referência do shiv.js deve ser colocado dentro do elemento <head>, pois os navegadores IE interpretam o HTML5 é necessário carregar esse arquivo antes de adicionar novos elementos.

HTML5 SVG Inline HTML5 Tutorial