手机端显示电脑端隐藏html源码,div+css实现电脑端显示手机端隐藏代码

这篇文章主要为大家详细介绍了div+css实现电脑端显示手机端隐藏代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴。

我们做网站有时候会出现这样的一种情况要求:图片或者广告在PC电脑端需要显示,但是在WAP手机移动端需要隐藏起来,如何实现呢?这个问题很多朋友咨询过361源码今天抽时间给大家做个小教程。

实现场景:

在小屏手机上或者是PAD上把指定区域的内容隐藏,电脑端不变。比如一段广告或者一个说明只想要在电脑端显示手机端隐藏。

实现方法:

1、通过JS加CSS实现

通过JS加CSS实现相对繁琐一些,但是效果也是很明显和实用的,今天在这里就不做介绍了,如果有需要做这样效果的朋友可以联系361源码在线客服帮您有偿处理。

2、通过DIV+CSS实现

在需要隐藏的区域加一个DIV,例如想在手机端隐藏bigpic这张图片,代码如下:

然后把DIV加一个样式代码如下:@media screen and (max-width: 1000px) { .none{display:none; }

}

(注意啦!上面的1000px表示如果屏幕尺寸达到了1000像素以下将会隐藏否则显示。具体数值可以自行调试)

以上就是div+css实现电脑端显示手机端隐藏代码的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持361模板网。

感谢打赏,我们会为大家提供更多优质资源!

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值