1、首先设置要了解网页页面布局框架结构,设定宽高和边框,以及设置好class或者ID名称。
2、打开Dreamweaver CS5,点击新建HTML。
3、根据设定的网页布局,设置div网页结构。
4、添加div标签的class名称,这里也可以使用ID类名。
5、 编辑CSS控制div块的宽高和背景。
6、 这样就可以让子元素置于底部。
需要准备的材料分别有:电脑、浏览器、html编辑器。
1、首先,打开html编辑器,新建html文件,例如:index.html,编写问题基础代码。
2、在index.html中的<style>标签中,输入css代码:label{float:leftpadding-top:4px}。
3、浏览器运行index.html页面,此时label的底部成功和select的底部对齐。
<!doctype html><html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
<style>
body {
font-size: 12px
}
#div1 {
width: 400px
margin: 20px auto
/*border:1px solid red*/
border-top: 1px solid blue
border-right: 1px solid blue
border-left: 1px solid blue
border-bottom: 1px solid red
height: 40px
position: relative
}
#div1 div{
width: 80px
height: 30px
font-size: 14px
line-height: 30px
text-align: center
float: left
background: #00FF00
color: #FFFFFF
border-left: 1px solid #eee
margin-left: 10px
position: absolute
bottom: 0
}
#div1 .mydiv2 {
left: 90px
}
#div1 .mydiv3 {
left: 180px
}
</style>
</head>
<body>
<div id="div1">
<div>建设文明</div>
<div>新浪微博</div>
<div>意见征求</div>
</div>
</body>
</html>