-
做任务一的时候把背景颜色写成backgroundColor了,结果始终出现不了框。正确的写法应该是background-color或background。查看全部
-
使用postion的绝对定位可以设置块的位置，例如left , postion : ab ,left 0 ,top 0就左上角了查看全部
-
清除浮动：clear:both; 因为有浮动，导致父级不能被撑开，边框不能随内容被撑开。查看全部
-
margin,padding:上-右-下-左查看全部
-
一列布局查看全部
-
特殊的三列布局--两边固定宽度，中间自适应 左边：position:absolute;top:0;left:0; 右边：position:absolute;top:0;right:0; 中间：margin：0 310px 0 210px；查看全部
-
清除浮动 clear:both查看全部
-
自适应宽度： <!DOCTYPE HTML><br> <html><br> <head><br> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"><br> <title>三列布局</title><br> <style type="text/css"><br> body{margin:0;padding:0;}<br> .left{width:200px;height:500px;background:#ccc;position:absolute;left:0;top:0;}<br> .middle{height:500px;background:#999;margin:0 310px 0 210px;}<br> .right{width:300px;height:500px;background:#ddd;position:absolute;right:0;top:0;}<br> </style><br> <body><br> <div class="left">200px</div><br> <div class="middle">设计首页的第一步是设计版面布局，就像传统的报刊杂志编辑一样，我们将网页看做一张报纸，一本杂志来进行排版布局，虽然动态网页技术的发展使得我们开始趋向于学习场景编辑，但是固定的网页版面设计基础依然是必须学习和掌握的。它们的基本原理是共通的，你可以领会要点，举一反三。</div><br> <div class="right">300px</div><br> </body><br> <html><br> 想让中间和旁边有间隔：0 310px 0 210px 没有间隔：0 300px 0 200px查看全部
-
如果第一个板块和第三个板块是固定的，第二个板块是自适应的没有用。那么用浮动就没有用就会显示乱动。不会排在一行当中查看全部
-
三列布局： <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Tyep" content="text/html;charset=utf-8"> <title>三列布局</title> <style type="text/css"> body{margin:0;padding:0;} .left{width:33.33%;height:500px;float:left;background:#ccc;} .middle{width:33.33%;height:500px;float:left;background:#999;} .right{width:33.33%;height:500px;float:right;background:#ddd;} </style> <body> <div class="left"></div> <div class="middle"></div> <div class="right"></div> </body> <html>查看全部
-
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Tyep" content="text/html;charset=utf-8"> <title>二列布局</title> <style type="text/css"> body{margin:0;padding:0;font-size:30px;font-weight:bold;} div{text-align:center;line-height:50px;} .main{width:1000px;height:600px;margin:0 auto;} .left{width:300px;height:600px;background:#ccc;float:left;} .right{width:660px;height:600px;background:#FCC;float:right;} </style> <body> <div class="main"> <div class="left">left</div> <div class="right">right</div> </div> </body> <html>查看全部
-
浮动（float）和 绝对定位（position：absolute），可以使元素脱离文档流查看全部
-
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type"content="text/heml;charset=utf-8"> <title>布局</title> <style type="text/css"> body{margin:0;padding:0;} .main{width:800px;margin:0 auto;} .left{width:20%;height:500px;float:left;background:#ccc;} .right{width:80%;height:500px;float:right;background:#ddd;} </style> </head> <body> <div class="main"> <div class="left"></div> <div class="right"></div> </div> </body> </html> 这样子两栏就被限制在副级之中了，就比如说是有一个整个页面，但是我们自定义有个框框，我们在这框框里面分成了两栏。查看全部
-
自使用宽度的代码显示：<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type"content="text/heml;charset=utf-8"> <title>布局</title> <style type="text/css"> body{margin:0;padding:0;} .left{width:20%;height:500px;float:left;background:#ccc;} .right{width:80%;height:500px;float:right;background:#ddd;} </style> </head> <body> <div class="left"></div> <div class="right"></div> </body> </html> 但是自适应宽度的代码很少用到。 我们经常用的是固定宽度的代码：查看全部
-
什么叫做自适应，就是当我们拖动浏览器窗口，比如说缩小或者放大，那么在里面的框框会根据浏览器的缩小或者放大来显示。比如说浏览器缩小了，那么我们的框框也会随之缩小。并且铺满整个页面查看全部
举报
0/150
提交
取消