织梦BUG

DIVCSS自动适应宽度,如果小于就隐藏

建站帮助2020-10-10
织梦教程简介:我们在做响应页面时,想在某个分辩率下把某个标签自动隐藏。比如导航,在正常分辨率下,显示宽的导航,在手机屏幕下,宽的导航自动隐藏,刚显示手机版的导航。...

我们在做响应页面时,想在某个分辩率下把某个标签自动隐藏。比如导航,在正常分辨率下,显示宽的导航,在手机屏幕下,宽的导航自动隐藏,刚显示手机版的导航。

代码如下 :

@media screen and (max-width:480px){
.nav{display:none; }
}

上面代码表示 在小于480px的分辩率,标签nav自动隐藏。以上是CSS3的方法,低端浏览器不支持。

css隐藏内容主要分为3总情况:

①隐藏所有内容无空白:display: none;

②隐藏溢出的文字或图片:overflow:hidden;

③隐藏内容但是仍然占据空间:visibility:hidden;

网站自适应css隐藏只是基础知识,对于隐藏最常见的用途就是js的一些特效展示。

DIVCSS自动适应宽度,等于或小于就隐藏的代码

@media only screen and (min-width: 480px) and (max-width: 2400px)
{	
       .dreamwap {
       display:none;
}	
}
注  .dreamwap 是需要隐藏的标签

版权声明

本文为站长原创文章,未经站长允许不得转载。本文地址:https://www.dedecmsbug.com/help/114.html