当前页面: 首页>> 网站问答 >>用CSS控制PC端和移动端展示不一样的内容

用CSS控制PC端和移动端展示不一样的内容

/ / 访问次数:905次

  今天,给大家介绍一个PC电脑网站与手机网站展示不一样的内容的方法(即:网站上有些内容,您只想展示给移动用户看,或者只想展示给电脑用户看,你都可以用这个方法来实现),这个方法实现起来相当简单,在网站设计时常会用到,

HTML模板中写入:

<div class="pc_only">

这里面的内容只能在PC端显示,手机网站是看不到的。

</div>

css里写入以下内容:

.pc_only{display:inline;}

@media screen and (max-width: 360px) {

 .pc_only{display: none;}

  是不是很简单,只需要在式样表中判断一下浏览器的宽度即可,只要浏览器的最大宽度小于360像素,就隐藏这个层内容,否则就展示层内容,就可以达到目的了,经过测试是有效的。


上一篇>>白岩松是最牛比,最历害的五毛党。

下一篇>>转自官网:Z-BlogPHP 模板文件与模板标签


可能下面的内容我们比较有兴趣>>>>

已有1位网友发表了看法:

1#游人  2017-10-20 19:00:44 回复该评论
很实用的小技巧,收藏了

发表评论

必填

选填

选填

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。