-
页面布局细分-2查看全部
-
页面布局细分-1查看全部
-
页面布局-1查看全部
-
注意：leftBox和rightBox设置浮动之后脱离了普通的文档流，不再占用原来文档中的位置，因此无法把父div撑开。查看全部
-
清除浮动也就是三句话，即三种方案： 1.使用带clear属性的空标签 2.在浮动元素的父容器设置overflow:hidden 3..在浮动元素的父容器使用clearfix(利用伪对象after) 最土的方法也可以给父元素增加高度查看全部
-
清除浮动查看全部
-
案例分析后主要知识点查看全部
-
Absolute脱离文档流初始位置被别人占据（所以父元素高度塌陷） 并且和未设置宽度时宽度随内容变化（所以父元素最好是relative） 无定位的祖先元素时是相对HTML不是body Absolute和float定位实现的区别：absolute不在文档流且内容可以压缩所以可以在同一排显示；float还在文档流，就算内容压缩，里面的元素宽度任然未压缩所以上不去同一排此时设置宽度即可解决。查看全部
-
当子div的内容高度不确定的时候，父级的div高度也不能设置高度查看全部
-
_height ie6识别最小高度350px，但是高度会自动放大，所以内容不会溢出查看全部
-
IE hack写法。查看全部
-
在CSS中没有a和d选项中的属性，list-style-image可以把图像设置为列表中的项目符号；list-style-type可以设置列表项目符号的不同样式，如：none表示无项目符号，disc表示实心圆（默认值），circle表示空心圆，square表示实心方块等。查看全部
-
<html> <div class="warp"> <div class="logo"> <div class="logo_left"> <img src="image/logo.jpg" alt="mukelogo"> </div> <div class="logo_right"> <img src="image/tel.jpg" alt="fuwutel">24小时服务热线：<span class="tel">123-456-7890</span> </div> </div> </div> </html> CSS代码： .warp{ width:100%; } .logo{ width:1000px; margin:0 auto; background-color:write; height:80px; } .logo_left{ float:left; } .logo.right{ float:right; margin:25px 20px 0 0; } .logo_right img{ height:28px; vertical-align:middle; margin-right:10px; } .tel{ font-size:20px; color:darkred; }查看全部
-
<html> <div class="top"> <div class="top_content"> <ul> <li><a>设为首页</a></li> <li><a>加入收藏</a></li> <li><a>联系我们</a></li> </ul> </div> </div> </html> CSS代码 *{ margin:0px; padding:0px; font-size:12px; } .top{ width:100%; height:27px; background:url("image/top_bg.jpg") repeat-x; } .top_content{ width:1000px; margin:0 auto; } .top_content ul{ float:right; } .top_content ul li{ display:inline-block; width:70px; line-height:27px; position:relative; } .top_content ul li:before{ position:ablusote; top:9px; left:-10px; content:""; width:0px; height:0px; font-size:0px; border:5px solid transparent; border-left-color:black; } .top_content ul li a:link,.top_content ul li a:visited{ text-decoration:none; color:#ccc; } .top_content ul li a:hover,.top_content ul li a:actiove{ text-decoration:none; color:#8f8f8f; }查看全部
-
/*------法二------*/ .mainBox{width:960px; background-color:#CFF; overflow:hidden; /*------总结：常用的清除浮动的方法。 1、使用空标签清除浮动。我用了很久的一种方法，空标签可以是div标签，也可以是P标签。我习惯用<P>，够简短，也有很多人用<hr>，只是需要另外 为其清除边框，但理论上可以是任何标签。这种方式是在需要清除浮动的父级元素内部的所有浮动元素后添加这样一个标签清除浮动，并为其定义CSS代 码：clear:both。此方法的弊端在于增加了无意义的结构元素。 对于使用额外标签清除浮动（闭合浮动元素），是W3C推荐的 做法。至于使用<br />元素还是空<div></div>可以根据自己的喜好来选（当然你也可以使用其它块级元素）。不过要注意的 是，<br />本身是有表现的，它会多出一个换行出来，所以要设定它的heigh为0，以隐藏它的表现。所以大多数情况下使用空<div>比较合 适。 2、使用overflow属性。此方法有效地解决了通过空标签元素清除浮动而不得不增加无意代码的弊端。使用该方法是只需在需要清除浮动的元素中定义CSS属性：overflow:auto，即可！”zoom:1″用于兼容IE6,也可以用width:100%。 不过使用overflow的时候，可能会对页面表现带来影响，而且这种影响是不确定的，你最好是能在多个浏览器上测试你的页面； 3、使用after伪对象清除浮动。 该方法只适用于非IE浏览器 。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置height:0，否则该元素会比实际高出若干像 素；二、content属性是必须的，但其值可以为空，蓝色理想讨论该方法的时候content属性的值设为”.”，但我发现为空亦是可以的。 此三种方法各有利弊，使用时应择优选择，个人习惯于第一种，比较稳定可靠。 参考链接：http://www.cnblogs.com/fengzheng126/archive/2012/05/19/2508778.html ------*/查看全部
举报
0/150
提交
取消