如何分别设置网站PC版和移动版广告

2015-10-29 22:17 建站相关 天中好青年

天中青年在逛站过程中发现,有的网站的广告设置很不一般。网站同一个广告位设置有两段不同的代码。

比如在名博导航(gerenpp.com)站的文章页面,在文章标题上方有个广告区域:

我们看一下它的广告代码设置:分别有<div id="ads-banner">电脑端广告和<div id="ads-banneryd">手机端广告。红色部分可以根据你的喜好命名。

大家都知道在百度广告联盟,广告有PC投放和移动投放两种选择,天中青年在这里也是用的这两种不同的广告。

这样设置的目的是,当我们在PC端浏览网站时显示的是PC端广告,此时移动端广告隐藏,反之亦然。

那么这是如何做到的呢?当然还是通过强大的CSS文件来实现的.

我们在网站主CSS文件中加入如下代码:

/* -----------------------------文章页广告----------------------------- */

#ads-banner{margin:0 10px;overflow:hidden;}

#ads-banneryd{display:none;}

这个是定义PC端时移动版广告不显示。

那么如何实现在移动端,电脑版广告不显示只显示移动版广告呢,天中青年告诉你答案:

将以下代码加入主CSS文件的

/* -----------------------------动态标签部分----------------------------- */

/* dropdown */}@media screen and (max-width:414px){html{-webkit-text-size-adjust:none}#ads-banner{display:none;}#ads-banneryd{display:block;}}
众位亲,如何?

发表评论:

  • 17条评论
  • 澳门银座注册2017-08-18 19:54:45回复
  • 大家都读过李绅写的:“锄禾日当午,汗滴禾下土。谁知盘中餐,粒粒皆辛苦”。和李白写的“床前明月光、疑似地上霜。举头望明月,低头思故乡”。大家来品读一下,文字是不是简单而又单纯地无痕呢?
  • 澳门银座平台2017-08-18 19:52:58回复
  • 一个人在头痛难忍的状态下写诗,写出来的文字就像是一颗颗钢针一样,写出来的意境有佛的境界,有时候也会有“宁教我负天下人,休教天下人负我”之不可思议
  • 澳门银座娱乐2017-08-18 19:50:44回复
  • 那是一个雪花纷飞的季节,地上结着厚厚的冰。明雨伫立在这城市的街头,她心里特别冷清,透着丝丝忧伤,丝丝落寞,不知这份失落该向何人诉说。突然很怀念小的时候,与发小们在一起,也许那时的我才算真的快乐。在清翠的松树林里,采摘松树蜜的情景,叫她心里觉得无比的温暖。
  • 澳门银座官网2017-08-18 19:46:50回复
  • 明雨告诉自己永远不要放弃,那怕笨鸟先飞,让生活更加充实,当一个人遇到困境的时候,明雨觉得那是在等待前程更加辉煌的盛宴!
  • 澳门银座官网2017-08-18 19:46:46回复
  • 明雨告诉自己永远不要放弃,那怕笨鸟先飞,让生活更加充实,当一个人遇到困境的时候,明雨觉得那是在等待前程更加辉煌的盛宴!
  • 澳门银座官网2017-08-18 19:46:41回复
  • 明雨告诉自己永远不要放弃,那怕笨鸟先飞,让生活更加充实,当一个人遇到困境的时候,明雨觉得那是在等待前程更加辉煌的盛宴!
  • 澳门银座官网2017-08-18 19:46:37回复
  • 明雨告诉自己永远不要放弃,那怕笨鸟先飞,让生活更加充实,当一个人遇到困境的时候,明雨觉得那是在等待前程更加辉煌的盛宴!
  • 李明2015-11-10 07:53:07回复
  • 这个要学习学习,我现在用手机和电脑不同模板,之前用响应式广告代码。
  • 豪杰博客2015-11-01 13:45:34回复
  • 每天来逛逛,都有收货, 主宰者博客www.myzhuzaizhe.com
  • 微童年2015-10-31 09:22:47回复
  • 我的就打算让主题设计师折腾了
  • boke112导航2015-10-30 22:16:01回复
  • 通过CSS来判断浏览器的大小,进而判断是PC或移动端,确实不错
  • 江西养牛人2015-10-30 11:01:51回复
  • 移动端流量是越来越多了,要是移动端不放广告确实是一个损失。可惜我不懂代码,只能慢慢的来学习了。
无言的温柔
不知道想说什么,但还是想说些什么
话家乡☆天中百科
轻松一下:调戏调戏小狗
最近发表
    文章归档