仓酷云

标题: 来谈谈：CSS实例教程:扫除浮动Clear [打印本页]

作者: 若相依 时间: 2015-1-15 23:26
标题: 来谈谈：CSS实例教程:扫除浮动Clear
当遇到几个选择器共享一个声明的时候，可以分组放在一起，每个选择器必须以逗号隔开。例：h1,h2,h3,h4{colorred;}选择器分组时要将每个选择器路径写全，分组结尾不能有逗号。
网页制造poluoluo文章简介：课程关头词：扫除浮动Clear.
课程关头词：扫除浮动Clear

还记得第二课我们做的例子的效果么？最初效果是，白色方块和蓝色方块都处于一行，我们利用“Float:left”，冲击了块状元素的“强横”即块状元素不同意其他元素和它处于统一行。我们将白色方块的CSS代码中到场了“Float:left;”后，白色方块终究同意蓝色方块和它处于统一行。如图：

我们换一种办法表达下面的意义，由于白色方块的“左边浮动”，才招致蓝色方块上移至白色方块的尾后；

在上个例子中，为了到达扫瞄器兼容性，我们分离在白色蓝色方块CSS代码平分别加了“Float:left;”，如许IE和FF中显现效果一样，假如此时我们还想放一个宽度400像素，高度100的绿色方块，并让其处于第二行，效果以下图：

但是这时候候不论怎样放，在IE中的效果一直是

招致绿色拍到蓝色的前面这类情形就是由于蓝色方块CSS代码中含有"Float:left;"，可是为了扫瞄器兼容性，又不克不及往失落(甚么？这句话看不分明，只能申明第二节课你没有好勤学，好好咀嚼！)，怎样办？
好办~！只需在CSS代码中到场上面这段代码：

.clear{clear:both;}

并在HTML代码中到场上面代码：

<divclass="clear"></div>

下面这句话事实加在谁人地位呢，要加在蓝色方块和绿色方块两头，然后看看效果是否是我们想要的了~^_^

<divid="redBlock">博客的左边</div>
<divid="blueBlock">博客的右边</div>
<divclass="clear"></div>
<divid="greenBlock">博客的版权信息</div>

目标就是为了扫除蓝色方块的浮动对上面绿色方块的影响！是影响哟~是扫除影响，而不是分明蓝色方块的浮动，大概说扫除蓝色方块的浮动对上面地区块发生的感化！（细心品品我说的这句话！）
假如仍是不分明，你就在白色方块和蓝色方块两头加上“<divclass="clear"></div>”，看看效果酿成甚么模样，然后再品品我方才说的话！

这节课就到这里，下节课我们做一个导航条，很有用的哟！必定要把前三节吃透，否则第四节会跟不上了解不透！</p>
在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。

作者: 兰色精灵 时间: 2015-1-17 22:39
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别，但它同时也存在着致命的弱点。

作者: 爱飞 时间: 2015-1-22 19:46
由CS4 版本开始，则转用WebKit 排版引擎（亦即Google Chrome和Apple Safari浏览器所用的排版引擎）作为网页预览。

作者: 愤怒的大鸟 时间: 2015-1-31 13:28
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

作者: 冷月葬花魂 时间: 2015-2-6 19:53
滚动条)层属性--溢出(visible/hidden/scroll/auto)

作者: 再现理想 时间: 2015-2-18 12:20
只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。

作者: 简单生活 时间: 2015-3-6 08:09
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

作者: 灵魂腐蚀 时间: 2015-3-20 06:03
还是在Dreamweaver所见即所得添加链接是，可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。

欢迎光临仓酷云 (http://ckuyun.com/)