CSS布局常用的方法4
[color=#000][font=Verdana][size=9.5pt]xhtml:[/size][/font][/color][color=#000][font=Verdana][size=9.5pt]QUOTE:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="center" class="column">[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<h1>This is the main content.</h1>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]</div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="left" class="column">[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<h2>This is the left sidebar.</h2>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]</div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="right" class="column">[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<h2>This is the right sidebar.</h2>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]</div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]CSS:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]QUOTE:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]body {margin: 0;padding-left: 200px;padding-right: 190px;min-width: 240px;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt].column {position: relative;float: left;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#center {width: 100%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#left {width: 180px; right: 240px;margin-left: -100%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#right {width: 130px;margin-right: -100%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]两行三列[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]xhtml:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]QUOTE:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="header">[font=宋体]这里是顶行[/font][font=Verdana]</div>[/font][/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="warp">[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="column">[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="column1">[font=宋体]这里是第一列[/font][font=Verdana]</div>[/font][/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="column2">[font=宋体]这里是第二列[/font][font=Verdana]</div>[/font][/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div class="clear"></div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]</div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div id="column3">[font=宋体]这里是第三列[/font][font=Verdana]</div>[/font][/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]<div class="clear"></div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]</div>[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]CSS:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]QUOTE:[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#header{width:100%; height:auto;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#wrap{ width:100%; height:auto;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#column{ float:left; width:60%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#column1{ float:left; width:30%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#column2{ float:right; width:30%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt]#column3{ float:right; width:40%;}[/size][/font][/color]
[color=#000][font=Verdana][size=9.5pt].clear{ clear:both;} [/size][/font][/color]
页:
[1]