用<div>写下表代码
<
!
DOCTYPE
html
>
<
html
>
<
head
>
<
meta
charset
=
"
utf-8
"
>
<
title
>
菜鸟教程(runoob.com)
</
title
>
</
head
>
<
body
>
<
div
id
=
"
container
"
style
=
"
width:500px
"
>
<
div
id
=
"
header
"
style
=
"
background-color:#FFA500;
"
>
<
h1
style
=
"
margin-bottom:0;
"
>
主要的网页标题
</
h1
>
</
div
>
<
div
id
=
"
menu
"
style
=
"
background-color:#FFD700;height:200px;width:100px;float:left;
"
>
<
b
>
菜单
</
b
>
<
br
>
HTML
<
br
>
CSS
<
br
>
JavaScript
</
div
>
<
div
id
=
"
content
"
style
=
"
background-color:#EEEEEE;height:200px;width:400px;float:left;
"
>
内容在这里
</
div
>
<
div
id
=
"
footer
"
style
=
"
background-color:#FFA500;clear:both;text-align:center;
"
>
版权 © runoob.com
</
div
>
</
div
>
</
body
>
</
html
>
大多数站点可以使用 <div> 或者 <table> 元素来创建多列。CSS 用于对元素进行定位,或者为页面创建背景以及色彩丰富的外观。
即使可以使用 HTML 表格来创建漂亮的布局,但设计表格的目的是呈现表格化数据 - 表格不是布局工具! |