🧚🏽 👩🏼‍🤝‍👨🏻 🎪 CssUserAgentライブラリ 🕵🏼 🤙🏾 🙏🏾

英語圏のインターネットの広大さの中、私はCssUserAgentという名前のjavascriptライブラリに出会いました。つまり、ページをロードすると、次のタイプのクラスがhtmlタグにハングアップします。

ua- browsername 
      

        
        
        
      

     ua- browsername-major 
      

        
        
        
      

     ua- browsername-major-minor 
      

        
        
        
      

     ua- browsername-major-minor-build 
      

        
        
        
      

     ua- browsername-major-minor-build-revision

カット利益の説明の下。

すでに述べたように、このスクリプトを使用してページを読み込むと、多くのクラスがhtmlタグにハングアップします。例はここにあります。個人的には、結果は次のとおりです。

 <!-- the CSS classes currently applied to this page tag are: --> <html class="ua-webkit ua-webkit-534 ua-webkit-534-15 ua-chrome ua-chrome-10 ua-chrome-10-0 ua-chrome-10-0-612 ua-chrome-10-0-612-3"> <head>…</head> <body>…</body> </html>

モバイルブラウザの場合、さらに2つのクラスが追加されます。

 <html class="… ua-mobile ua-mobile-iphone …">…<html>

追加のコードに加えて、何が得られますか？

まず、 cssua.userAgentオブジェクトを使用できます。これは、私の場合は次の形式でした。

 cssua.userAgent = { webkit: "534.15", chrome: "10.0.612.3" };

したがって、IEのバージョンとして簡単かつ簡単に定義できます。

 if (cssua.userAgent.ie < 8) { /*   */ }

両方のモバイルブラウザ

 if (cssua.userAgent.mobile) { /*    */ }

次に、CSSコードの操作が少し簡単になります。これはブラウザに依存する場合があります。

 .logo-area { background-image: url(logo.png); background-repeat: no-repeat; background-position: left top; } /*  IE 5.0, 5.5, 6.0 */ .ua-ie-5 .logo-area, .ua-ie-6 .logo-area { /*  IE < 7.0    24- PNG */ background-image: url(logo.gif); }

このライブラリがお役に立てば幸いです！

CssUserAgentライブラリ

More articles: