html文字做成表格,html代码做一些特殊表格(一)

我们一般制作帖子的表格边框,基本上大同小异.现在教大家用代码制作别具一格的表格边框.在这里所有的效果我只用套材来举例.边框里可以放图片和文字,也可以换成颜色和文字.图片和颜色大家可以根据需要自己更换.只要发挥想象力,相信大家都能制作出更漂亮的表格边框.

语法简单介绍:

BORDER-RIGHT: #9b0000 6px ridge; 右边框颜色 宽度 样式 BORDER-TOP: #9b0000 6px ridge; 上边框颜色 宽度 样式 BORDER-LEFT: #9b0000 6px ridge; 左边框颜色 宽度 样式 BORDER-BOTTOM: #9b0000 6px ridge; 下边框颜色 宽度 样式 ; 外边框定位(相对定位) ; 内部小表格的定位(绝对定位) LEFT: 0px; 离左边的距离 TOP: 0px; 离顶部的距离 RIGHT: 0px; 离右边的距离 BOTTOMM: 0px; 离下边的距离 HEIGHT: 512px 表格高度 WIDTH: 512px; 表格宽度 表格边框的样式还有以下几种(换不同的值就会有不同的边框样式):

none | dotted | dashed | solid | double | groove | ridge | inset | outset

注意点:

如果不是宽屏外边框必须赋于相对定位.内部表格必须绝对定位. 上,下,左,右边框如果有不需要显示的,将该边的宽度值 设为0即可. 主要图片以背景的方式加入即放在里更好一些.

效果一:

代码如下:

效果二:

代码如下：

效果三：

代码如下：

效果四：

代码如下：

效果五：

写字

内容

代码如下：

效果六：

代码如下：

效果七：

玫瑰茶苑

玫瑰茶苑

玫瑰茶苑

玫瑰茶苑

代码如下：

玫瑰茶苑 玫 瑰 茶 苑 玫瑰茶苑 玫 瑰 茶 苑

效果八:

代码如下：

效果九：

代码如下：

效果十：[/center] 代码如下：