用div与css实现网页布局案例,html+css+div网页设计与布局

http://www.itjxue.com  2023-01-08 01:02  来源:未知  点击次数: 

用div+css技术制作用户登陆页面布局

由样式控制单元格及容器的宽度就可以实现了 你给看看我随意手写的一个例子,你保存为table.html,然后浏览... height:20px;} /style body div class="table" div class="cell"/divdiv class="cell"/divdiv class...

求一个网页制作高手用div+css做一个网页布局 急 谢谢!!!!!!!!!!!

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=gb2312" /

title无标题文档/title

style type="text/css"

#containt{ height:530px; width:400px; margin:0 auto; border:1px solid #000000;}

#top{ height:100px; width:380px; margin-top:7px; margin-left:9px;}

#top_left{ height:100px; width:138px; float:left; border:1px solid #000000; border-right:none;}

#top_right{ height:100px; width:238px; float:left; border:1px solid #000000;}

#content{ height:50px; width:380px; margin-top:5px; margin-left:9px; border:1px solid #000000;}

#bottom{ height:350px; width:380px; margin-top:5px; margin-left:9px;}

#bom_left{ height:350px; width:138px; float:left; border:1px solid #000000;}

#bom_right{ height:350px; width:235px; float:left; border:1px solid #000000; margin-left:3px;}

.b_r_div{ height:100px; width:68px; margin-left:6px; float:left; margin-top:5px; border:1px solid #000000;}

#b_r_bottom{ height:120px; width:225px; margin-left:5px; float:left; margin-top:5px; border:1px solid #000000;}

/style

/head

body

div id="containt"

div id="top"

div id="top_left"/div

div id="top_right"/div

/div

div id="content"/div

div id="bottom"

div id="bom_left"/div

div id="bom_right"

div class="b_r_div"/div

div class="b_r_div"/div

div class="b_r_div"/div

div class="b_r_div"/div

div class="b_r_div"/div

div class="b_r_div"/div

div id="b_r_bottom"/div

/div

/div

/div

/body

/html

怎么用div布局加css样式做网页

在div里设置id或者class

div id="aaa"/div

div class="bbb"/div

然后在css样式表里定义样式

#aaa{

}

.bbb{

}

(责任编辑:IT教学网)

更多

推荐时间特效文章