-
.box{ width:960px; background:#cff; clear:both; } .left{ width:740px; height:300px; background:#c9f; float:left; } .right{ width:210px; height:300px; background:#fcf; float:right; } .clear{ clear:both; overflow:hidden; } </style> </head> <body> <!--在此添加相应的div标签--> <div class="box clear"> <div class="left"></div> <div class="right"></div> </div> </body> </html>查看全部
-
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <style> li { list-style:none; } li ul li { list-style:circle; } li ul li ul li { list-style:square; } </style> <body> <!--在此制作一个嵌套列表--> <div> <ul> <li>首页</li> <li>课程中心 <ul> <li>Web前端 <ul> <li> HTML</li> <li>CSS</li> <li>JavaScript</li> <li>jQuery</li> </ul> </li> <li>安卓开发</li> <li>PHP全栈</li> </ul> </li> </ul> </div> </body> </html>查看全部
-
错题本1查看全部
-
overflow:hidden 越出的隐藏掉查看全部
-
display:block 把元素变为块级元素 display:inline 把元素变为行内元素查看全部
-
link visited hover active love hate 设置链接状态顺序查看全部
-
自顶向下,逐步细化查看全部
-
clear:both 清除浮动,可防止父元素塌陷查看全部
-
list-style查看全部
-
.list a:link, .list a:visited { font-size: 10px; color: #000; text-decoration: none; } .list a:hover, .list a:active { font-size: 10px; background:#BE3948; color: #FFF; display:block; text-decoration: none; } 设置顺序 a:link a:visted a:hover a:active查看全部
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>3.1页面头部制作练习题</title> <style type="text/css"> /*在此定义相关样式,控制列表的显示形式*/ .list{ height=30px; } .list li { float:left; width:50px; height:30; list-style-type: none; margin:0px auto; line-height:30px; text-align: center; } .list a:link, .list a:visited { font-size: 10px; color: #000; text-decoration: none; } .list a:hover, .list a:active { font-size: 10px; background:#BE3948; color: #FFF; display:block; text-decoration: none; } } </style> </head> <body> <h3>课程难度</h3> <div> <ul class="list"> <li><a href="#" name="全部">全部</li> <li><a href="#" name="初级">初级</li> <li><a href="#" name="中级">中级</li> <li><a href="#" name="高级">高级</li> </ul> </div> </body> </html>查看全部
-
-总结:常用的清除浮动的方法。 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属性的值设为”.”,但我发现为空亦是可以的。查看全部
-
overflow:hidden查看全部
-
去掉最后一个竖线:.copyright_content li:last-child { background: none; } 微信关注图标不加这个居中感觉好难受- -。 .copyright_content img { vertical-align:middle; }查看全部
-
硬性规定,记笔记。查看全部
举报
0/150
提交
取消