当前位置:首页WordPressDiv+CSS内容只在电脑端展示,移动端隐藏的方法

Div+CSS内容只在电脑端展示,移动端隐藏的方法

有这个需求是因为图酷给导航网站加了底部板块,但是图酷只想让这个板块在电脑端展示,在移动端隐藏起来。为此,我在网上也查找方法,发现很少有人介绍,毕竟有这个需求的人可能不多。后来还是让图酷发现了一个Div+CSS内容只在电脑端展示,移动端隐藏的方法,特此记录以供参考。

实现方法

想要隐藏网页某段内容,可以在它的前面新加一个Div,参考代码如下:

<div class="none"> 需要隐藏的内容 </div>

然后对Div添加一个样式,代码如下:

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

PS:将上面的样式加入到CSS文件中,样式的意思是当屏幕尺寸达到560像素以下将会自动隐藏该Div层,如果你也想如此操作,站长可对数值进行调整。预览效果可以查看图酷导航底部板块,在手机端将对内容进行隐藏。

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

给TA打赏
共{{data.count}}人
人已打赏
WordPress精选教程

7b2美化教程-认证图标修改为动态金V

2023-4-4 22:37:56

WordPress精选教程

仿优设导航程序源码免费分享

2023-7-14 22:40:51

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索