第二种制作方法:
 |
1. |
准备工作:制作两个小圆角图片,如右图。可以先制作一个,让后用相关软件翻转就可以了
|
|
|
2. |
制作一个一行三列的表格。表格的cellpadding、cellspacing均设置为零。(此处为了便于说明,暂时将border设置为"1")
|
|
|
3. |
将第一步的两个小图片分别插入第一、第三单元格
|
|
|
4. |
设置第一个单元格的align=left、valign=top,使图片在单元格的左上方,第三个单元格的align=right 、valign=top,使图片在单元格的右上方。并调整单元格的大小 |
|
|
5. |
将单元格的背景色(注意是单元格)设置为插入的图片颜色相同。
|
| 这种表格是不是很眼熟啊?的确,我们可以在很多的大网站找到它的身影。 | |
6. |
将表格的border设置为"0",然后在下面再插入一个同样边框颜色的细线表格(此步骤省略,如果不会,可参照上面的细线表格技巧),现在就可以在细线表格里写入内容了。 |
代码如下:
<table width="150" cellpadding="0" cellspacing="0" border="0">
<tr bgcolor="#7090ff">
<td valign="top" align="left" width="10"><img src="411-w03.gif" width="7" height="7"></td>
<td width="127" bgcolor="#7090ff"> </td>
<td align="right" valign="top" width="10"><img src="411-w04.gif" width="7" height="7"></td>
</tr>
</table>
<table width="150" cellspacing="1" cellpadding="0" border="0" bgcolor="#7090ff">
<tr>
<td bgcolor="#FFFFFF">这种表格是不是很眼熟啊?的确,我们可以在很多的大网站找到它的身影。</td>
</tr>
</table> 说明:它由两个单独的表格组成,其中第一个表格是出现圆角的关键!
5、两个并排的表格