-
三列布局：不能使用float，左右两列绝对定位，分别靠左和靠右，中间列为相对定位，左右margin分别设置为左右两列的宽度即可，如果列与列之间需要间隔，则增加相应的margin值。查看全部
-
宽度自适应：随着浏览器的大小变动。例如例子里的左右固定宽度，中间宽度自适应。左右的div被设置了position.查看全部
-
position:absolute；left 0;top 0;->绝对定位，放在左上查看全部
-
margin:0 auto;->水平居中查看全部
-
文档流：将窗口自上而下分成一行一行，并在每行中按从左至右的依次排放元素，即为文档流。 有三种情况使得元素离开文档流而存在，分别是浮动 绝对布局 固定定位查看全部
-
三列布局----左右均用绝对定位，中间用margin .left{ width:200px; height:600px; background:#ccc; position:absolute; left:0; top:0} .main{ height:600px; margin:0 310px 0 210px; background:#9CF} .right{ height:600px; width:300px; position:absolute; top:0; right:0;; background:#FCC;}查看全部
-
.main{ width:960px; height:600px; margin:0 auto} .left{ width:300px; height:600px; background:#ccc; float:left;}}/*左浮动样式*/ .right{ width:660px; height:600px; background:#000; float:right;}/*右浮动样式*/查看全部
-
<title>一列布局</title> <style type="text/css"> body{ margin:0; padding:0; font-size:30px} div{ text-align:center; font-weight:bold} .main,.footer{ width:960px; margin:0 auto;}/*水平居中*/ .head{ width:100%; height:100px; background:#ccc} .main{ height:600px; background:#FCC} .footer{ height:50px; background:#9CF}查看全部
-
一列布局 1.一般用于网站首页，页面比较简单 2.因为只有一列，网页宽度较宽，所以一般不会插入多行文字，否则会比较容易串行。只有简单的图片文字超链接。 3.头部 class=“header”主体=“main”底部=“footer” 4.清除内外边距：margin：0；padding:0； 5.div水平居中：margin：0 auto； margin：0代表垂直方向 auto代表左右方向查看全部
-
footer没颜色或跑位原因：main没有被里面的元素撑开。 解决办法：1.给main使用隐藏溢出overflow:hidden;让main撑开。 2.给受影响元素清除浮动clear:both;去除影响。 推荐用办法1.查看全部
-
一列布局 1.一般用于网站首页，页面比较简单 2.因为只有一列，网页宽度较宽，所以一般不会插入多行文字，否则会比较容易串行。只有简单的图片文字超链接。 3.头部 class=“header”主体=“main”底部=“footer” 4.清除内外边距：margin：0；padding:0； 5.div水平居中：margin：0 auto； margin：0代表垂直方向 auto代表左右方向查看全部
-
布局又称为板式布局，将网页UI设计师将优先的视觉元素进行有机排列组合。比如淘宝，主要为展示商品。网页布局主要延续纸媒的技巧。但有区别。 1、网页宽度可以自适应宽度。2、理论上长度可以无限延长。高度可以根据内容自适应。 常见网页布局，头部，主体，底部。主体再根据需要分栏，有一二三栏，也即是一列二列三列布局。更多是混合布局。前端就是用技术手段，通过css的浮动，定位实现布局。艺术和技术融合的完美岗位。查看全部
-
<!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=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:900px; height:600px; margin:0 auto} .left{ width:300px; height:600px; background:#ccc; float:left;margin-left:30px}/*左浮动样式*/ .right{ width:540px; height:600px; background:#FCC; float:right;margin-left:30px}/*右浮动样式*/ </style> </head> <body> <div class="main"> <div class="left">left</div> <div class="right">right</div> </div> </body> </html>查看全部
-
固定定位（position：fixed） 浮动（float） 绝对定位（position：absolute）查看全部
-
文档流：将窗口自上而下分成一行一行，并在每行中按从左至右的依次排放元素，即为文档流。 有三种情况使得元素离开文档流而存在，分别是浮动 绝对布局 固定定位查看全部
举报
0/150
提交
取消