如何实现google或者百度联盟广告代码嵌在文章内容中|文字环绕广告代码

  哈哈,要让文字环绕广告代码其实很简单,过去一直沿用的代码今天终于给换了,我让他排在左边就排列在左边,排列在右边就右边,废话很多,就是为了很清楚的说明这个问题,我本菜鸟,为了广大菜鸟能够很明白的看懂,就以本文的内容来所吧。(网页顶部和左边的广告更能吸引眼球。)俺做点好事,把代码贡献出来,大家直接套用即即可。

   

<!--添加新广告代码,此处的广告代码是左对齐的,就是左边那一个,这里以百度的广告为例-->
<div style="float:left;height:150px;width:1px;"><!--一个宽为1px的空白层,利用该层的高度控制广告层上下的位置。--></div>
<div style="float:left;height:250px;width:300px;clear:left;background:#ffffff;margin:15px 5px 5px 0;">
<!--广告代码-->
<script type="text/javascript">/*300*250,创建于2012-1-10*/ var cpro_id = 'u738899';</script><script src="http://cpro.baidu.com/cpro/ui/c.js" type="text/javascript"></script>
</div>

<!--添加新广告代码,此处的广告代码是对齐的,就是右边那一个,这里以谷歌的广告为例-->
<div style="float:right;height:700px;width:1px;"><!--一个宽为1px的空白层,利用该层的高度控制广告层上下的位置。--></div>
<div style="float:right;height:250px;width:300px;clear:right;background:#ffffff;margin:25px 5px 5px 0;">
<!--广告代码-->
<script type="text/javascript"><!--
google_ad_client = "ca-pub-4717517040851142";
/* 300x250, 创建于 08-7-8 */
google_ad_slot = "3615858431";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

<!--下面为文章内容-->
<p>文章内容</p>  

=====================================

此代码有巨大的弱点就是遇到表格、遇到图片规定了对齐方式的时候,会出现一些小毛病,希望知道的同学继续优化和改进它,谢谢。

下面给大家说说本代码中最重要的一个问题,也就是关键问题clear的用法


有四个clear:both|left|right|none;
简单来说呢,clear属性的作用就是“清除”浮动。
如果某元素设置clear:left;表示该元素左边不存在浮动元素
相应的,clear:right;表示该元素右边不存在浮动元素;clear:both;表示该元素两边都不存浮动元素。clear:none表示两边允许有浮动元素。
在视觉上要使某元素左边或右边不存在浮动元素,就只有它往下移一行,或浮动元素往下移一行。(这个元素肯定是不能将浮动元素清除的了,只是用这样的方式达到页面布局的效果而已)   

简单点,就是不想要两个层排列在一行,clear下就下移了。

THE END
打赏
海报
如何实现google或者百度联盟广告代码嵌在文章内容中|文字环绕广告代码

  哈哈,要让文字环绕广告代码其实很简单,过去一直沿用的代码今天终于给换了,我让他排在左边就排列在左边,排列在右边就右边,废话很多,就是为了很清楚的说明这个问题,我本菜鸟,为了广大菜鸟能够很明白的看懂,就以本文的内容来所吧。(网页顶部和左边的广告更能吸引眼球。)俺做点好事,把代码贡献出来,大家直接套用即即可。

   

<!--添加新广告代码,此处的广告代码是左对齐的,就是左边那一个,这里以百度的广告为例-->
<div style="float:left;height:150px;width:1px;"><!--一个宽为1px的空白层,利用该层的高度控制广告层上下的位置。--></div>
<div style="float:left;heig...

<<上一篇
下一篇>>