码迷,mamicode.com
首页 > Web开发 > 详细

HTML高级编程(1)——HTML 布局

时间:2014-07-19 16:38:29      阅读:273      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   color   使用   strong   

在网络上,随处都可以看到像报纸那样的格式化分栏。

 

HTML布局 - 使用表格

One very common practice with HTML, is to use HTML tables to format the layout of an HTML page.

A part of this page is formatted with two columns, like a newspaper page.

As you can see on this page, there is a left column and a right column.

This text is displayed in the left column.

An HTML <table> is used to divide a part of this Web page into two columns.

The trick is to use a table without borders, and maybe a little extra cell-padding.

No matter how much text you add to this page, it will stay inside its column borders.

 

同样的布局 - 添加了颜色

One very common practice with HTML, is to use HTML tables to format the layout of an HTML page.

A part of this page is formatted with two columns, like a newspaper page.

As you can see at this page, there is a left column and a right column.

An HTML <table> is used to divide a part of this Web page into two columns.

This text is displayed in the right column.

The trick is to use a table without borders, and maybe a little extra cell-padding.

No matter how much text you add to this page, it will stay inside its column borders.

 

实例

将HTML页面的一部分分割为表格的列是很容易的。为了您可以亲自尝试它,我们为您准备了这个简单的例子

<html>
<body>

<table border="0" width="100%" cellpadding="10">
<tr>

<td width="50%" valign="top">
This is some text. This is some text. This is some text. This is some text. This is some text.
</td>

<td width="50%" valign="top">
Another text. Another text. Another text. Another text. Another text. Another text. Another text.
</td>

</tr>
</table>

</body>
</html>

bubuko.com,布布扣

HTML高级编程(1)——HTML 布局,布布扣,bubuko.com

HTML高级编程(1)——HTML 布局

标签:des   style   blog   color   使用   strong   

原文地址:http://www.cnblogs.com/blueskylcc/p/3854049.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!