Continue a explicar as habilidades do HTML5:
16. Suporte ao vídeo
O elemento de áudio <Audio> é muito semelhante e suporta vídeos HTML5 em novos navegadores. De fato, recentemente o YouTube anunciou uma nova incorporação de vídeo HTML5. Infelizmente, como a documentação HTML5 não indica um codificador específico para o vídeo, depende principalmente do navegador. Embora o Safari e o IE9 possam suportar vídeos nos formatos H.264, o Firefox e o Opera ainda se atendem aos formatos Theora e Vorbis. Portanto, ao exibir vídeos HTML5, você deve fornecer dois formatos.
17. Vídeo pré -carregado
Primeiro você precisa decidir se precisa de um navegador para pré -carregar o vídeo. Existe uma necessidade? Suponha que um visitante entre em uma página dedicada à exibição de vídeos, é muito necessário pré -carregar a página para economizar algum tempo de espera. Você pode pré -carregar o vídeo definindo a pré -carga = pré -carga ou adicionar pré -carga entre eles.
<Preload de vídeo>
...
</video>
18. Controles de exibição
Você deve ter notado que, com o código acima, o vídeo aparecerá apenas como uma imagem sem componentes controláveis. Para obter esses controles de reprodução, devemos especificar essas propriedades de controle no elemento de vídeo.
<controle de pré -carga de vídeo>
...
</video>
19. Expressões regulares
Graças às propriedades do novo padrão, podemos inserir uma expressão regular diretamente no código.
<Método de forma = pós -ação =>
<Rótulo para = nome de usuário> Crie um nome de usuário: </cretwle>
<ID de entrada = nome de usuário Tipo = Nome do texto = Nome de usuário espaço reservado = 4 <> 10 ″ Necessário = requerido AutoFocus = AutoFocus Pattern = [a-za-z] {4,10}>
<Button Type = Submite> GO </Button>
</morm>
Se você estiver mais familiarizado com expressões regulares, notará esse novo padrão: [a-Za-Z] {4,10} aceita apenas letras superiores e minúsculas. Essa string deve ter pelo menos quatro caracteres, até dez caracteres.
20. Detecte o suporte do navegador para atributos
Como mencionado anteriormente, nem todos os navegadores suportam essas propriedades, então existe alguma maneira de saber se o navegador pode reconhecê -los? Esta pergunta é muito boa. Aqui estão duas maneiras de apresentá -lo a você. A primeira opção é usar o Modernizr para detectar, ou você também pode criar e analisar esses elementos para ver o que o navegador tem. Por exemplo, no exemplo anterior, se quisermos determinar se o navegador pode executar a propriedade Pattern, podemos adicionar JavaScript à página:
alerta ('padrão' em document.createElement ('input')) // boolean;
De fato, essa é uma maneira muito comum de determinar a compatibilidade do navegador. A biblioteca jQuery aproveita esse truque. No código acima, criamos um novo elemento de entrada e confirmamos se o atributo de padrão pode ser reconhecido. Se puder ser reconhecido, o navegador suporta essa função, caso contrário, não será suportado.
<Cript>
if (! 'padrão' em document.createElement ('input')) {
// Faça validação do lado do cliente/servidor
}
</script>
Lembre -se, isso precisará ser alcançado confiando no JavaScript!
21. Marca elementos
A principal função do elemento <sk> é destacar o texto na página que precisa destacar visualmente sua importância para o usuário. A string embrulhada nesta tag deve estar relacionada ao comportamento atual do usuário. Por exemplo, se eu procurar abrir sua mente em alguns blogs, posso usar o JavaScript na tag <sk> para envolver cada ação.
<H3> Resultados da pesquisa </h3>
<H6> Eles foram interrompidos, logo após o disse Quato, <sk> abrir sua mente </mark>. </h6>
22. Quando usar <div>
Você ainda precisa usar a tag <div>? Claro que é necessário. Por exemplo, se você deseja envolver um pedaço de código em um elemento, especialmente para o posicionamento do conteúdo, <div> será uma escolha muito ideal. No entanto, se não for a situação acima, mas para embrulhar uma lista de links de postagem ou rodapé do blog, é recomendável que você use elementos <Artigo> e <Nav>, respectivamente.