定位某些屏幕大小和useragent来查看/隐藏某些内容内容

时间:2017-10-13 08:11:05

标签: html css pug

我正在开发一个登录表单,我在跨浏览器渲染方面遇到了困难。

当我使用Chrome时,所有内容都应显示,并且登录表单上的页脚应该是它应该位于的位置。但是,当我使用Firefox打开登录表单时,页脚不应该位于登录表单底部的位置。

我想添加<hr>,只有在Firefox浏览器中打开表单并且显示宽度高于768px 时才会显示hr.div_buttons_ff .col-md-12.col-lg-12.col-xl-12.col-sm-12 footer.footer_desk hr.div_footer p.no_acc_desk Don't Have an account ? a.join_now_desk(href="#") Join now. 。它不应该在Chrome,Safari等其他浏览器中显示。

我正在使用jade / pug和bootstrap作为前端,css将某些规则应用于表单。

我的代码如下。

Jade / Pug:

@media screen and (min-width:768px) and (-moz-document)
{    
   .div_buttons_ff
   {
       padding: 1px 0px 1px 0px;
       border: none;
       outline: none;
       clear: both;    
   }    
}

CSS:

    @-moz-document url-prefix()
    {
       @media screen and (min-width:768px)
       {
          .div_buttons_ff
          {
             padding: 1px 0px 1px 0px;
             border: none;
             outline: none;
             clear: both;      
         }
      }
   }

我也尝试过嵌套媒体查询,如下所示:

-moz-document url-prefix()

此外,我尝试将<div id="google_translate_element"></div> <script type="text/javascript"> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.FloatPosition.TOP_LEFT}, 'google_translate_element'); } </script> <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script> Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). 嵌套到媒体中,但又没有成功。

0 个答案:

没有答案