div+css各种常见布局,(及布局技巧).doc

下载文档

2
0
约9.4千字
约 8页
2017-12-19 发布于河南
举报
版权申诉
保障服务

div+css各种常见布局,(及布局技巧).doc

1、本文档共8页，可阅读全部内容。
2、有哪些信誉好的足球投注网站（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击这里二次下载。
4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。

divcss各种常见布局,(及布局技巧)

下面列举了各种常见的css+div布局》》》》》完全按%布局。完全固定布局。左侧按%变动，右侧固定布局。右侧按%变动，左侧固定布局。两侧按%变动，中间固定布局。中间按%变动，两侧固定布局完全按%布局。 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml head meta http-equiv=Content-Type content=text/html; charset=utf-8 / title无标题文档/title /head!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml head meta http-equiv=Content-Type content=text/html; charset=utf-8 / title无标题文档/title /head style type=text/css html,body{ padding:0px; margin:0px; text-align:center; } #top{ margin:10px auto; border:#333 1px solid; width:85%; height:150px;} #main{ margin:10px auto; width:85%; height:auto; border:#F00 1px solid; } #main #left{ border: #FF0 1px solid; margin:1px; float:left; width:40%; height:300px; margin:1px;} #main #right{ float: right; border:#0F0 1px solid; width:58%; height:600px;} #bottom{ margin:10px auto; border:#333 1px solid; width:85%; height:150px;} .clear{ border:0px; clear:both; visibility: hidden; height:0px;} /style body div id=toptop部分/div div id=main div id=left 左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变动左侧变 /div !--右侧变动内容（start）-- div id=right 右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动右侧变动 /div !--右侧变动内容end）-- div class= clear/div!--去除浮动！-- /div div id=bottombottom部分/div /body /html 完全固定布局。 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml head meta http-equiv=Content-Type content=text/html; charset=utf-8 / title无标题文档/title /head style type=text/css html,body{ padding:0px; margin:0px; text-align:center; } #top{ margin:10px auto; border:#333 1px solid; width:760px; height:150px;} #main{ margin:10px auto; width:760px; height:auto; border:#F00 1px solid; } #main #left{ border: #FF0 1px solid; margin:1px; float:left; width:2