DIV+CSS页面布局练习

来源：互联网发布：李天生sqlserver 编辑：程序博客网时间：2024/09/21 09:25

<html>

<head>

<style>

body{text-align:center;}

div.qq{width:960px;height:1500px;background:yellow;margin:0 auto;text-align:left;} //定义整个页面居中

div.llz{width:750px;height:400px;background:black;float:left;} //定义两列布局，第一列左侧浮动

div.lly{width:200px;height:400px;background:black;float:right;} //定义两列布局，第二列左侧浮动

div.slz{width:310px;height:400px;background:gray;float:left;margin-right:15px;margin-top:20px;}//定义三列布局，第一列左侧浮动

div.slc{width:310px;height:400px;background:gray;float:left;margin-right:15px;margin-top:20px;} //定义三列布局，第二列在第一列旁

div.sly{width:310px;height:400px;background:gray;float:right;margin-top:20px;}//定义三列布局，第三列右侧浮动

div.box{width:200px;height:50px;background:pink;float:left;margin-left:10px;margin-top:10px;}//定义多列布局，全部左侧浮动

</style>

</head>

<body>

</div>

</body>

</html>

选择器起名的时候，标记的类名直接使用，标记.类名，如果标记里嵌套标记，命名选择器标记1 标记2.类名（空格）代表对标记1里的标记2中的类名给样式

阅读全文

0 0