续上篇文章说到 “自适应网站PC端显示移动端隐藏方法” 朋友又问道说,那我以后有广告商要求只做移动端,不做pc端,该怎么办呢?接下来我教大家怎么实现PC端隐藏移动端显示方法。
1、 CSS控制隐藏某个内容元素代码如下:
.z556{ display: none; }
PS:这里大家就会有疑惑了,隐藏了都没有了啊,请继续看下分解。
2、CSS控制判断实现移动端隐藏方法代码:
@media screen and (max-width:700px){ .z556,{display:block}
PS:700px表示屏幕大于700像素会显示,小于则隐藏。display:block 重新显示移动端该内容。
3、需要隐藏区域加一个div盒子,代码如下:
<div class="z556">这里就是隐藏内容</div>
PS:.z556是一个值 class是选择器,class"值"使用方法.值。
4、css选择器我在分享几个常用的吧,方便大家选择使用。
id"值"使用方法 #值
class"值"使用方法 .值
div > em 子元素选择器
具体数值可以自行调试,一般需要隐藏的内容都有本身的class值或其他,没有的话我们就自己添加个div盒子,使用前先把css判断代码放进去,当然多个调用方法{ .z556, .z557, .z558, {display:block }以此类推。
广告插入