html中怎样水平左浮动,左浮动和右浮动里的元素怎样垂直、水平居中。设定了最小宽度。把浏览器缩小一定比例的时布局全部乱了...

Document

*{

padding: 0;

margin: 0;

}

body{min-width: 900px;}

.header,

.footer{

width: 100%;

height: 100px;

background: #000000;

text-align: center;

float: left;

line-height: 100px;

}

.logo{

float: left;

}

.nav{

float: right;

line-height: 100px;

word-spacing: 20px;

margin-right: 30px;

}

ul li{

font-family: "微软雅黑";

color: #fff;

display: inline;

}

.container{

padding: 0 300px 0 400px;

}

.left,

.middle,

.right{

position: relative;

min-height: 600px;

float: left;

}

.middle{

width: 100%;

background: #FF9999;

}

.middle img{

position: absolute;

top: 0;

right: 0;

bottom: 0;

left: 0;

margin: auto;

}

.left{

width: 400px;

background: #FFCC99;

margin-left: -100%;

left: -400px;

}

.left-li span{

background: #FF9999;

}

.right{

width: 300px;

background: #CCFFFF;

margin-left: -300px;

right: -300px;

}

.f-nav{

word-spacing: 30px;

}

• 课程
• 职业路径
• 实战
• 猿问
• 手记

课程推荐

职业路径 HTML5与CSS3实现动态网页

职业路径 零基础入门Android语法与界面

职业路径 ios基础语法与常用控件

职业路径 PHP入门开发

职业路径 JAVA入门开发

登陆

• 网站首页
• 企业合作
• 人才招聘
• 友情链接
• 联系我们
• 常见问题