外边框HTML代码,HTML代码-边框篇

HTML代码-边框篇

2018-09-12

表格以

分别作起始标识符。其中，之下，还需要由两个成对的标识符号定义表格的行、列，它们分别是……，……，tr标识符定义表中的行，td标识符定义数据表元，即每行中的每一列。……要包含在……里面。此外，论坛要求在

Hello Table

效果如下：

Hello Table

Hello Table

HTML之表格篇：表格的修饰(一)

No.1  表格边框的修饰

上一讲我们讲到border属性，border即为边框，除了有粗细的数值定义以外，还有其他的属性哦。我们先来看看亮边框的颜色和暗边框的颜色设置。亮边框记作bordercolorlight，暗边框记作bordercolordark。它们的数值可以用red、green、blue等表达，也可以用#11ee00这样的方式来表达，比如：bordercolorlight=red，bordercolorlight=#808000。请看下面的表格：

Hello Table

以上表格的全部代码清单如下：

Hello Table

上表中，左、上边框是亮边框，右、下边框为暗边框。怎么样？这么一修饰就好看多了吧？

边框颜色方面还有一个属性：bordercolor。当同时设置了暗、亮边框的颜色，bordercolor的颜色设置是多余的，这一点应该注意。现在我们用bordercolor来设置一下表格边框，看看有什么效果：

Hello Table

代码清单：

Hello Table

上面我们学习的有关表格边框颜色的设置，下面继续跟黑马教授学习表格边框其他方面的知识。

内容不多了，还讲两个表格边框的属性：一是边框线(cellpadding)粗细和边框空白处的大小，取值范围从0开始，用正整数。下面是代码和表格效果：

Hello Table 边框线:2 ，边框空白处:8

Hello Table 边框线:2 ，边框空白处:8

HTML表格篇——表格的修饰(二)

No.2  表格背景的修饰

默认情况下，HTML网页里表格的背景色是白色的。这显然不总是符合我们的要求，我们通常会设置各种背景颜色，以配合网页或贴子主题。

设置表格的背景色很简单，给其bgcolor属性赋值即可，写作bgcolor=数值，其数值取值方式和上一讲讲到的边框颜色是一致的，比如：bgcolor=black或bgcolor=#000000。bgcolor属性应该放置在表格初始符

当中。下面举个实例，先是代码，后是效果：

背景色：bgcolor=#CCCC00 暗边框颜色：#008000 亮边框颜色：#008060

背景色：bgcolor=#CCCC00

暗边框颜色：#008000

亮边框颜色：#008060

[注一：代码中用上了设置字体对齐方式，在

和之间用

来定义左对齐，这种方式的定义无需终止标识符，而定义字体的那句则需要在结束字体定义处有终止标识符号。]

[注二：细心的朋友可能已经发现，表格代码里多了一组

……，这是怎么回事呢？又是什么意思呢？在纯粹的HTML表格里本来可以不要这个的，但论坛有论坛的语法规范，它用来定义表格体，如果没有，系统也会自动在之间加上，且它要把……包含在里面。今后在论坛里制作表格应该养成加和的习惯。]

除了使用背景色，我们还可以使用图片来修饰表格背景，应该说，用图片来修饰表格的外观会更漂亮得多。不过应该注意，用来作表格背景图的文件不要太大，太大了打开网页速度较慢，图片的尺寸方面，要么是有规则图案的小图片，要么就是和表格大小相一致的，否则做出的表格也不会有理想的外观效果。下面我们在上面表格的基础上，用这幅图来作表格的背景图片：

代码及效果如下：

代码(红色那句就是加背景图的语法，放在

background=http://www.h4.dion.ne.jp/~herb/kabe-1.gif

背景色：bgcolor=#CCCC00

暗边框颜色：#008000

亮边框颜色：#008060

效果：

背景色：bgcolor=#CCCC00

暗边框颜色：#008000

亮边框颜色：#008060

Hello Table 边框线:2 ，边框空白处:8

免责声明：本文仅代表文章作者的个人观点，与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺，请读者仅作参考，并自行核实相关内容。

http://www.pinlue/style/images/nopic.gif