Wulin.com (www.vevb.com) Introdução ao artigo: Modernizr e HTML5.
OK, HTML5 é popular agora, então vou adicionar html5 ao seu título :)
De fato, o Modernizr nasce para o HTML5 - é uma biblioteca JS que detecta o suporte dos navegadores para recursos HTML5 e CSS3. O famoso site de compatibilidade do navegador HTML5/CSS3 FindMeByip é baseado nessa estrutura.
Você pode ver que existe um link para o Modernizr no botão verde no canto inferior direito.
Características do ModernizrA função do Modernizr é realmente muito simples. É usar o JS para detectar o suporte do navegador para os recursos HTML5/CSS3. Se ele suportar um determinado atributo, adicione uma classe correspondente à tag <html> da página. Se não o suportar, adicione uma classe sem prefixo. Por exemplo, se o navegador detectado suportar a tag de vídeo, o Modernizr adicionará uma classe de vídeo à tag <html>, caso contrário, adicione uma classe sem video.
Verifique o código -fonte do FindMeByip ou use uma ferramenta como o FireBug para visualizar o código da página e você pode ver a classe na tag <html>.
Além disso, a Modernizr também fornece outro uso, que é detectar o apoio do navegador apenas para um determinado recurso, como:
É relativamente seguro detectar o suporte do navegador ao HTML5 por meio de interfaces semelhantes.
Detecção do navegador: UA vs RecursosDe fato, todos geralmente usam UA para detectar um navegador. Obviamente, a UA também fornece informações mais ricas. O UA não é onipotente e também possui algumas fraquezas, como o disfarce do UA do navegador do usuário e a falta de informações da UA fornecidas por alguns navegadores para trás, afetarão o julgamento das informações do navegador. Mais importante, para os recursos HTML5, usando o UA para determinar se um navegador suporta um determinado recurso é muito complexo e não confiável.
Obviamente, sempre houve debates sobre UA e detecção de recursos. O que eu quero dizer aqui é que a análise específica de questões específicas, usando o HTML5 para detectar o suporte aos recursos no site é mais confiável e conveniente do que ua ~~
Usando modernizrO uso do Modernizr é muito simples, basta apresentar o arquivo JS da biblioteca na página:
>/script>
O Modernizr é de código aberto, mas por algum motivo foi bloqueado pelo G-FW.
Modernizr @ gitO projeto Modernizr está hospedado no Git, você pode obtê -lo no seguinte endereço:
O autor também fornece uma página de saída simples no Git:
E uma página de teste detalhada:
Leitura estendida:Detectando recursos HTML5
Implante com segurança HTML5 e CSS3 com Modernizr