【音画教程】多层背景边框的做法

日志

关于我

醉龙归舟

把影子加点盐,腌起来风干,老的时候下酒。

文章分类

2011-04-08 12:26:14| 分类：音画教程 | 标签： |举报 |字号大中小订阅

下载LOFTER 我的照片书 |

多层背景边框的做法

编制/归舟

HTML语言，就是一个公式，网上有很多关于这方面的知识，我就画下下面的公式，大家照着描就好了，你只要在可以使用HTML功能的地方，把下面的“东西”照搬着放到里面就好：

这是个七层的公式，当然依次类推，你可以做的更多，或者你只要一层也可以啊：））

1第一层：<table div align="center" border="0" cellpadding="0" cellspacing="15" width="540" background="http://bbs.hnol.net/theimg/2004-6-20/18/2004620188861105.jpg">
<tr><td width="100%" align="center">

第二层：<table border="0" cellpadding="0" cellspacing="3" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553461.jpg">
<tr><td width="100%" align="center">

第三层：
<table border="0" cellpadding="0" cellspacing="20" width="100%" background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018101221105.jpg">
<tr><td width="100%" align="center">

第四层：
<table border="0" cellpadding="0" cellspacing="2" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553461.jpg">
<tr><td width="100%" align="center">

第五层：
<table border="0" cellpadding="0" cellspacing="5" width="100%" background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018103131105.jpg">
<tr><td width="100%" align="center">

第六层：
<table border="0" cellpadding="0" cellspacing="1" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553461.jpg">
<tr><td width="100%" align="center">

第七层：
<table border="0" cellpadding="0" cellspacing="0" width="100%" background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018101221105.jpg">
<tr><td width="100%" align="center">

大家看见了吧，除了第一层有几个格式不一样，后面几个基本一样，就是限定的数字不一样，由你自己限定，做出来看着好看就好了，这是目的：））

注意，还有这个也是不一样的--background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018101221105.jpg"*>，就是引号里面的。那个网址就是你自己想要放在自己网页里面的背景图片，你想想如果都用一种背景图片，我们干吗这么费劲地做七遍啊：））所以要选择不同的背景图片才可以显示层次感，才会丰富好看啊：）））当然，选择的时候几层要搭调，就的协调，才好看。大家看明白了吗？

上面介绍的就是背景的制作。

接下来，就要把自己喜欢的图片和文字加上---

也很简单，图片的最简单格式---

其中，要变化的和背景一样，就是图片的网址，和“500”、“400”。500指的是宽，你不想要那么宽，你可以设定成450、350。。。。。等。“400”指是的高，和宽的道理一样：）））

文字，要先规定它的颜色、字体和大小，一般格式如下：

看见里面，什么是颜色，什么是字体，什么是大小了吧，这也是随你喜好调整的：）））

在它的下面加自己的文字就好了，行和行用“<br>”就好了。

简单吧：）））

再下来就是放自己喜欢的音乐，常用格式如下：

可以调整的就是引号里面的“网址”--指你选择的歌的网址，播放器的大小尺寸。

最后收尾。就是加上下面的就好了。

</DIV></TD></TR></TABLE></DIV></TD></TR></TABLE>
</DIV></TD></TR></TABLE></DIV></TD></TR></TABLE>
</DIV></TD></TR></TABLE></DIV></TD></TR></TABLE>
</DIV></TD></TR></TABLE>

有几层加几个： </DIV></TD></TR></TABLE>

到此，一个漂亮的网页就在你的手下做成功了，呵~~~~试试看，是不是很很简单哦：）））

注意，在做的时候，把所有的*号，去掉，那是为了在讲的时候，发在网页上不会显现出来是真实的图片了：）））－－W我已把上面的*号去掉了：）

===========================下面的你可以不看，看了也没坏处：））

<*html> 是开头标记，指明下面是HTML语言编写的。
<*head><*bgsound src="http://www.6uc.com/ycb/jiaoshi/g-yyj/music/20.mp3" loop=3*><*/head>
是指HTML文件主题，一般音乐文件也可以插在此处。反正隐藏的音乐无论放在什么地方都可以的。

相关属性调整：

［align="center"］表格的摆放位置（水平），可选值为： "left", "right", "center"

［border="0"］表格边框的厚度，不同浏览器有不同的内定值，故请指明。

［cellpadding="0"］文字内容与格线的距离。

［cellspacing="15"］表格格线的厚度，数值越大，显示就越厚。

［width="540"］表格宽度，接受绝对值（如 80）及相对值（如 80%）。

［background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553878.jpg"］表格的背景图片，（与＂ bgcolor ＂不要同用）。

在<*td>里面的［width="100%"］是指表格里面内容占整个表格的100%，［align="center"］指表格里面的内容居中.

注明:最后一层表格，<*table border="0" cellpadding="0" cellspacing="0" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553907.jpg"*><*tr><*td width="100%" align="center"*>
在<*table .......>的属性中勿须设制居中，把居中设制在<*td width="100%" align="center"*>里面。在<*td>里面的"width="100%"是指表格里面内容占整个表格的100%，*align="center"*指表格里面的内容居中，这样在这个格里的所有内容不用加居中符号它们也是居中的，省去了很多代码。
为了使整个代码帖发表后在论坛里居中所以只用在第一层表格的<*table> 里加上居中就可以了，后面多层的居中就加在<*td>里面。第一层表格中，<*table .......>里面的*align="center"*是指表格在整个页面处于居中，*width="540"* 是指整个表格的宽度。

下面是帖子内容文字的代码：

<*FONT face=隶书 color=#FFFF00 size=5*>

［face=隶书］指字体

［color=#FFFF00］指文字颜色

［size=4］指文字大小，数值越大文字越大

文字中间<*br>是换行符号

说明：

背景层的代码如下：<*table border="2" cellpadding="0" cellspacing="2" bordercolorlight="#C9B976" bordercolordark="#C9B976"*><*tr><*td>

没用背景图片也没用背景颜色，只用了边框的颜色的属性。

［bordercolorlight="#C9B976"］表格边框向光部分的颜色

［bordercolordark="#C9B976" ］表格边框背光部分的颜色

由于在整个内容部分的表格层里的<*td width="100%" align="center"*>中设制了居中，所以这个表格中的内容都会居中，在这里的图片边框表格和图片代码中都不需要再设制居中了。图片也只用调整宽和高了。

图片的代码如下：<*img border="0" src="http://211.147.4.138/upload/00/80/54/88/805488_1076739938031.jpg" width="320" height="240"*>

注明：在每张图片层的结尾处都不要忘了收尾<*/TD><*/TR><*/TABLE>，用了几个表格来加框这里就要有几个收尾。

在主题内容的图片和文字完了之后，由于前面把整个帖子的内容加了表格的，所以这里在内容图片文字完结之后不要忘了收尾<*/td><*/tr><*/table><*/td><*/tr><*/table><*/td><*/tr><*/table>

这里用了三个<*table>就要有三个<*/table> 来结尾.这样主题内容算是完成了。后面的就加一些装饰的图，签上名字等`````再来就是帖子结尾了。最前面的我用了七层表格做为帖子背景，这里收尾也要有七个层。

<*/td><*/tr><*/table><*/td><*/tr><*/table>
<*/td><*/tr><*/table><*/td><*/tr><*/table>
<*/td><*/tr><*/table><*/td><*/tr><*/table>
<*/td><*/tr><*/table>

说明：看起来好像是用了四层表格，其实只用了两层，同一个背景图。主要是边框向光和背光部分的颜色应用起到的效果。

原代码如下：
<table lign="center" border="1" cellpadding="8" cellspacing="10" width="400" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg" bordercolorlight="#0C091D" bordercolordark="#C0B4FE"><tr><td width="100%" align="center">
<table lign="center" border="1" cellpadding="4" cellspacing="6" width="100%" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg" bordercolorlight="#0C091D" bordercolordark="#C0B4FE"><tr><td width="100%" align="center">
<br>
<img border="0" src="http://bbs.shidabbs.com/bbs/UploadFile/2004-9/200491343855762.gif"><br>
<br>
</td></tr></table></td></tr></table>

说明：
这种效果其实有好几种方法做出来，但是在我认为这种是最简单的，只是金色背景那层（第二层）表格的宽是100%其它属性值一律为0。主要是在第三层，第三层的宽width的取值要是99%，而第三层的td里的width属性要是100%。

源代码如下：
<table lign="center" border="0" cellpadding="0" cellspacing="10" width="400" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg"><tr><td width="100%" align="center">
<table lign="center" border="0" cellpadding="0" cellspacing="0" width="100%" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215251105.jpg"><tr><td width="100%" align="center">
<table lign="center" border="0" cellpadding="0" cellspacing="0" width="99%" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg"><tr><td width="100%" align="center">
<br>
<img border="0" src="http://bbs.shidabbs.com/bbs/UploadFile/2004-9/200491343855762.gif"><br>
<br>
</td></tr></table></td></tr></table></td></tr></table>

说明：这个好像没什么特别的，就是把四个角上的框架图用表格分开。

源代码：
<table lign="center" border="0" cellpadding="0" cellspacing="0" width="400" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg"><tr><td width="100%" align="center">
<TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=0><TBODY><TR><TD width="50%" align=left><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/20049282322381105.gif"></TD><TD width="50%" align=right><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/20049282322681105.gif"></TD></TR></TBODY></TABLE>
<br>
<img border="0" src="http://bbs.shidabbs.com/bbs/UploadFile/2004-9/200491343855762.gif"><br>
<br>
<TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=0><TBODY><TR><TD width="50%" align=left><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/200492823221011105.gif"></TD><TD width="50%" align=right><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/200492823221331105.gif"></TD></TR></TBODY></TABLE></td></tr></table>

说明：
把图片应用到边框上面，整个表格的大小很重要，调整也是件麻烦的事，所以建议大家用表格格线的厚度cellspacing的属性值或者是表格格线的间距cellpadding的属性值来调整。

源代码：

") 说明：
把图片应用到边框上面，整个表格的大小很重要，调整也是件麻烦的事，所以建议大家用表格格线的厚度cellspacing的属性值或者是表格格线的间距cellpadding的属性值来调整。

源代码：

最后把表格的相关属性再全都说明一下。

<TABLE> 的参数设定（常用）：

</td></tr></table>

HTML语言，就是一个公式，网上有很多关于这方面的知识，我就画下下面的公式，大家照着描就好了，你只要在可以使用HTML功能的地方，把下面的“东西”照搬着放到里面就好：

这是个七层的公式，当然依次类推，你可以做的更多，或者你只要一层也可以啊：））

1第一层：<table div align="center" border="0" cellpadding="0" cellspacing="15" width="540" background="http://bbs.hnol.net/theimg/2004-6-20/18/2004620188861105.jpg">
<tr><td width="100%" align="center">

第二层：<table border="0" cellpadding="0" cellspacing="3" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553461.jpg">
<tr><td width="100%" align="center">

第三层：
<table border="0" cellpadding="0" cellspacing="20" width="100%" background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018101221105.jpg">
<tr><td width="100%" align="center">

第四层：
<table border="0" cellpadding="0" cellspacing="2" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553461.jpg">
<tr><td width="100%" align="center">

第五层：
<table border="0" cellpadding="0" cellspacing="5" width="100%" background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018103131105.jpg">
<tr><td width="100%" align="center">

第六层：
<table border="0" cellpadding="0" cellspacing="1" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553461.jpg">
<tr><td width="100%" align="center">

第七层：
<table border="0" cellpadding="0" cellspacing="0" width="100%" background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018101221105.jpg">
<tr><td width="100%" align="center">

大家看见了吧，除了第一层有几个格式不一样，后面几个基本一样，就是限定的数字不一样，由你自己限定，做出来看着好看就好了，这是目的：））

注意，还有这个也是不一样的--background="http://bbs.hnol.net/theimg/2004-6-20/18/200462018101221105.jpg"*>，就是引号里面的。那个网址就是你自己想要放在自己网页里面的背景图片，你想想如果都用一种背景图片，我们干吗这么费劲地做七遍啊：））所以要选择不同的背景图片才可以显示层次感，才会丰富好看啊：）））当然，选择的时候几层要搭调，就的协调，才好看。大家看明白了吗？

上面介绍的就是背景的制作。

接下来，就要把自己喜欢的图片和文字加上---

也很简单，图片的最简单格式---

其中，要变化的和背景一样，就是图片的网址，和“500”、“400”。500指的是宽，你不想要那么宽，你可以设定成450、350。。。。。等。“400”指是的高，和宽的道理一样：）））

文字，要先规定它的颜色、字体和大小，一般格式如下：

看见里面，什么是颜色，什么是字体，什么是大小了吧，这也是随你喜好调整的：）））

在它的下面加自己的文字就好了，行和行用“<br>”就好了。

简单吧：）））

再下来就是放自己喜欢的音乐，常用格式如下：

可以调整的就是引号里面的“网址”--指你选择的歌的网址，播放器的大小尺寸。

最后收尾。就是加上下面的就好了。

</DIV></TD></TR></TABLE></DIV></TD></TR></TABLE>
</DIV></TD></TR></TABLE></DIV></TD></TR></TABLE>
</DIV></TD></TR></TABLE></DIV></TD></TR></TABLE>
</DIV></TD></TR></TABLE>

有几层加几个： </DIV></TD></TR></TABLE>

到此，一个漂亮的网页就在你的手下做成功了，呵~~~~试试看，是不是很很简单哦：）））

注意，在做的时候，把所有的*号，去掉，那是为了在讲的时候，发在网页上不会显现出来是真实的图片了：）））－－W我已把上面的*号去掉了：）

===========================下面的你可以不看，看了也没坏处：））

<*html> 是开头标记，指明下面是HTML语言编写的。
<*head><*bgsound src="http://www.6uc.com/ycb/jiaoshi/g-yyj/music/20.mp3" loop=3*><*/head>
是指HTML文件主题，一般音乐文件也可以插在此处。反正隐藏的音乐无论放在什么地方都可以的。

相关属性调整：

［align="center"］表格的摆放位置（水平），可选值为： "left", "right", "center"

［border="0"］表格边框的厚度，不同浏览器有不同的内定值，故请指明。

［cellpadding="0"］文字内容与格线的距离。

［cellspacing="15"］表格格线的厚度，数值越大，显示就越厚。

［width="540"］表格宽度，接受绝对值（如 80）及相对值（如 80%）。

［background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553878.jpg"］表格的背景图片，（与＂ bgcolor ＂不要同用）。

在<*td>里面的［width="100%"］是指表格里面内容占整个表格的100%，［align="center"］指表格里面的内容居中.

注明:最后一层表格，<*table border="0" cellpadding="0" cellspacing="0" width="100%" background="http://www.xqwuyu.com/UploadFile/2004-6/200462902553907.jpg"*><*tr><*td width="100%" align="center"*>
在<*table .......>的属性中勿须设制居中，把居中设制在<*td width="100%" align="center"*>里面。在<*td>里面的"width="100%"是指表格里面内容占整个表格的100%，*align="center"*指表格里面的内容居中，这样在这个格里的所有内容不用加居中符号它们也是居中的，省去了很多代码。
为了使整个代码帖发表后在论坛里居中所以只用在第一层表格的<*table> 里加上居中就可以了，后面多层的居中就加在<*td>里面。第一层表格中，<*table .......>里面的*align="center"*是指表格在整个页面处于居中，*width="540"* 是指整个表格的宽度。

下面是帖子内容文字的代码：

<*FONT face=隶书 color=#FFFF00 size=5*>

［face=隶书］指字体

［color=#FFFF00］指文字颜色

［size=4］指文字大小，数值越大文字越大

文字中间<*br>是换行符号

说明：

背景层的代码如下：<*table border="2" cellpadding="0" cellspacing="2" bordercolorlight="#C9B976" bordercolordark="#C9B976"*><*tr><*td>

没用背景图片也没用背景颜色，只用了边框的颜色的属性。

［bordercolorlight="#C9B976"］表格边框向光部分的颜色

［bordercolordark="#C9B976" ］表格边框背光部分的颜色

由于在整个内容部分的表格层里的<*td width="100%" align="center"*>中设制了居中，所以这个表格中的内容都会居中，在这里的图片边框表格和图片代码中都不需要再设制居中了。图片也只用调整宽和高了。

图片的代码如下：<*img border="0" src="http://211.147.4.138/upload/00/80/54/88/805488_1076739938031.jpg" width="320" height="240"*>

注明：在每张图片层的结尾处都不要忘了收尾<*/TD><*/TR><*/TABLE>，用了几个表格来加框这里就要有几个收尾。

在主题内容的图片和文字完了之后，由于前面把整个帖子的内容加了表格的，所以这里在内容图片文字完结之后不要忘了收尾<*/td><*/tr><*/table><*/td><*/tr><*/table><*/td><*/tr><*/table>

这里用了三个<*table>就要有三个<*/table> 来结尾.这样主题内容算是完成了。后面的就加一些装饰的图，签上名字等`````再来就是帖子结尾了。最前面的我用了七层表格做为帖子背景，这里收尾也要有七个层。

<*/td><*/tr><*/table><*/td><*/tr><*/table>
<*/td><*/tr><*/table><*/td><*/tr><*/table>
<*/td><*/tr><*/table><*/td><*/tr><*/table>
<*/td><*/tr><*/table>

说明：看起来好像是用了四层表格，其实只用了两层，同一个背景图。主要是边框向光和背光部分的颜色应用起到的效果。

原代码如下：
<table lign="center" border="1" cellpadding="8" cellspacing="10" width="400" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg" bordercolorlight="#0C091D" bordercolordark="#C0B4FE"><tr><td width="100%" align="center">
<table lign="center" border="1" cellpadding="4" cellspacing="6" width="100%" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg" bordercolorlight="#0C091D" bordercolordark="#C0B4FE"><tr><td width="100%" align="center">
<br>
<img border="0" src="http://bbs.shidabbs.com/bbs/UploadFile/2004-9/200491343855762.gif"><br>
<br>
</td></tr></table></td></tr></table>

说明：
这种效果其实有好几种方法做出来，但是在我认为这种是最简单的，只是金色背景那层（第二层）表格的宽是100%其它属性值一律为0。主要是在第三层，第三层的宽width的取值要是99%，而第三层的td里的width属性要是100%。

源代码如下：
<table lign="center" border="0" cellpadding="0" cellspacing="10" width="400" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg"><tr><td width="100%" align="center">
<table lign="center" border="0" cellpadding="0" cellspacing="0" width="100%" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215251105.jpg"><tr><td width="100%" align="center">
<table lign="center" border="0" cellpadding="0" cellspacing="0" width="99%" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg"><tr><td width="100%" align="center">
<br>
<img border="0" src="http://bbs.shidabbs.com/bbs/UploadFile/2004-9/200491343855762.gif"><br>
<br>
</td></tr></table></td></tr></table></td></tr></table>

说明：这个好像没什么特别的，就是把四个角上的框架图用表格分开。

源代码：
<table lign="center" border="0" cellpadding="0" cellspacing="0" width="400" background="http://bbs.hnol.net/theimg/2004-9-28/23/200492823215801105.jpg"><tr><td width="100%" align="center">
<TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=0><TBODY><TR><TD width="50%" align=left><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/20049282322381105.gif"></TD><TD width="50%" align=right><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/20049282322681105.gif"></TD></TR></TBODY></TABLE>
<br>
<img border="0" src="http://bbs.shidabbs.com/bbs/UploadFile/2004-9/200491343855762.gif"><br>
<br>
<TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=0><TBODY><TR><TD width="50%" align=left><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/200492823221011105.gif"></TD><TD width="50%" align=right><img border="0" src="http://bbs.hnol.net/theimg/2004-9-28/23/200492823221331105.gif"></TD></TR></TBODY></TABLE></td></tr></table>

说明：
把图片应用到边框上面，整个表格的大小很重要，调整也是件麻烦的事，所以建议大家用表格格线的厚度cellspacing的属性值或者是表格格线的间距cellpadding的属性值来调整。

源代码：

") 说明：
把图片应用到边框上面，整个表格的大小很重要，调整也是件麻烦的事，所以建议大家用表格格线的厚度cellspacing的属性值或者是表格格线的间距cellpadding的属性值来调整。

源代码：

最后把表格的相关属性再全都说明一下。

<TABLE> 的参数设定（常用）：

</td></tr></table>

width="400"
表格宽度，接受绝对值（如 80）及相对值（如 80%）。

border="1"
表格边框的厚度，不同浏览器有不同的内定值，故请指明。

cellspacing="2"
表格格线的厚度

cellpadding="2" 表格格线与内容的间隔。

align="CENTER"
表格的摆放位置（水平），可选值为： left, right, center

valign="TOP".
表格内内容的对齐方式（垂直），可选值为： top, middle, bottom。　　

background="myweb.gif"
表格的背景图片，与 bgcolor 不要同用。

bgcolor="#0000FF"
表格的底色，与 background 不要同用

bordercolor="#CF0000"
表格边框颜色

bordercolorlight="#00FF00"
表格边框向光部分的颜色

bordercolordark="#00FFFF"

表格边框背光部分的颜色，使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。
width="400"
表格宽度，接受绝对值（如 80）及相对值（如 80%）。

border="1"
表格边框的厚度，不同浏览器有不同的内定值，故请指明。

cellspacing="2"
表格格线的厚度

cellpadding="2" 表格格线与内容的间隔。

align="CENTER"
表格的摆放位置（水平），可选值为： left, right, center

valign="TOP".
表格内内容的对齐方式（垂直），可选值为： top, middle, bottom。　　

background="myweb.gif"
表格的背景图片，与 bgcolor 不要同用。

bgcolor="#0000FF"
表格的底色，与 background 不要同用

bordercolor="#CF0000"
表格边框颜色

bordercolorlight="#00FF00"
表格边框向光部分的颜色

bordercolordark="#00FFFF"

表格边框背光部分的颜色，使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。

军事体育 2011年03月29日 - 醉龙归舟 -

音画收藏 2011年03月29日 - 醉龙归舟 -

情感文章	养眼酷图	音画图文	经典视听
电子图库	软件下载	奇闻趣事	视频大观
古今珍藏	财经汽车	电脑知识	音画教程
博客代码	音画素材	纵横杂谈	时尚娱乐
健康饮食	笑话大全	中外文学	百科知识

﹡欢迎光临﹡

﹡返回空间首页﹡

评论这张

转发至微博

阅读(963)| 评论(17)

历史上的今天

this.p={  m:2,
              b:2,
              loftPermalink:'',
              id:'fks_094074080086080068092083083095087086085069092094086074',
              blogTitle:'【音画教程】多层背景边框的做法',
              blogAbstract:'  <P\>  <TABLE style=\"BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;\"  borderColor=\"#a25e5e\"  cellSpacing=\"0\"  cellPadding=\"3\"  width=\"800\"  align=\"center\"  bgColor=\"#ad8d85\"  border=\"40\"  \>  <TBODY\>  <TR\>  <TD\>  <P align=\"center\"  \><FONT color=\"#000000\"  size=\"2\"  \> <FONT color=\"#000000\"  size=\"5\"  \><STRONG\>多层背景边框的做法</STRONG\></FONT\></FONT\></P\>  <P align=\"center\"  \><FONT color=\"#000000\"  size=\"5\"  \><STRONG\>编制/归舟</STRONG\></FONT\></P\>  <P\><FONT color=\"#000000\"  size=\"2\"  \>HTML语言，就是一个公式，网上有很多关于这方面的知识，我就画下下面的公式，大家照着描就好了，    你只要在可以使用HTML功能的地方，把下面的“东西”照搬着放到里面就好：</FONT\></P\>  <P\><FONT color=\"#000000\"  size=\"2\"  \>    这是个七层的公式，当然依次类推，你可以做的更多，或者你只要一层也可以啊：））</FONT\></P\>  <P\><FONT color=\"#000000\"  size=\"2\"  \>1第一层：<table div align=\"center\"</FONT\></P\></TD\></TR\></TABLE\></P\>',
              blogTag:'table,width,td,center,tr',
              blogUrl:'blog/static/3046880920113802614708',
              isPublished:1,
              istop:false,
              type:2,
              modifyTime:1316963837139,
              publishTime:1302236774708,
              permalink:'blog/static/3046880920113802614708',
              commentCount:17,
              mainCommentCount:17,
              recommendCount:3,
              bsrk:-100,
              publisherId:0,
              recomBlogHome:false,
              currentRecomBlog:false,
              attachmentsFileIds:[],
              vote:{},
              groupInfo:{},
              friendstatus:'none',
              followstatus:'unFollow',
              pubSucc:'',
              visitorProvince:'',
              visitorCity:'',
              visitorNewUser:false,
              postAddInfo:{},
              mset:'000',
              mcon:'',
              srk:-100,
              remindgoodnightblog:false,
              isBlackVisitor:false,
              isShowYodaoAd:false,
              hostIntro:'把影子加点盐,腌起来风干,老的时候下酒。',
              hmcon:'1',
              selfRecomBlogCount:'0',
              lofter_single:'<iframe width="140" height="560" style="overflow:hidden;" src="http://www.lofter.com/mailEntry.do?blogad=1&blog" frameBorder="0"></iframe>'
            }

{list a as x}
    {if !!x}
    <div class="iblock nbw-fce nbw-f40">
      <a class="fc03 noul" target="_blank" hidefocus="true" href="http://blog.163.com/${x.visitorName}/">
      {if x.visitorName==visitor.userName}
      <img alt="${x.visitorNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.visitorName)}&r=${visitor.imageUpdateTime}"/>
      {else}
      <img alt="${x.visitorNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.visitorName)}"/>
      {/if}
      </a>
      <div class="cwd vname thide">
        {if x.moveFrom=='wap'}
          <a class="noul pnt" target="_blank" href="http://blog.163.com/services/wapblog.html?frompersonalbloghome"><span title="来自网易手机博客" class="iblock wapIcon"> </span></a>
        {elseif x.moveFrom=='iphone'}
          <a class="noul pnt" target="_blank"><span title="来自iPhone客户端" class="iblock iphoneIcon"> </span></a>
        {elseif x.moveFrom=='android'}
          <a class="noul pnt" target="_blank"><span title="来自Android客户端" class="iblock androidIcon"> </span></a>
        {elseif x.moveFrom=='mobile'}
          <a class="noul pnt" target="_blank" href="http://blog.163.com/services/emsblog.html?frompersonalbloghome"><span title="来自网易短信写博" class="iblock wapIcon"> </span></a>
        {/if}
        <a class="fc03 m2a"  target="_blank" hidefocus="true" href="http://blog.163.com/${x.visitorName}/">
          ${fn(x.visitorNickname,8)|escape}
        </a>
      </div>
    </div>
    {/if}
    {/list}

<#--最新日志，群博日志--> <#--推荐日志-->

<p class="fc06">推荐过这篇日志的人：</p>
    <div>
      {list a as x}
      {if !!x}
      <div class="iblock nbw-fce nbw-f40">
        <a class="fc03 noul" target="_blank" hidefocus="true" href="http://blog.163.com/${x.recommenderName}/">
        <img alt="${x.recommenderNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.recommenderName)}"/>
        </a>
        <div class="cwd thide">
          <a class="fc03 m2a" target="_blank" hidefocus="true" href="http://blog.163.com/${x.recommenderName}/">
            ${fn(x.recommenderNickname,6)|escape}
          </a>
        </div>
      </div>
      {/if}
      {/list}
    </div>
    {if !!b&&b.length>0}
    <p  class="fc06">他们还推荐了：</p>
    <ul>
    {list b as y}
      {if !!y}
        <li class="rrb"><span class="iblock">·</span><a class="fc03 m2a" target="_blank" href="http://blog.163.com/${y.recommendBlogPermalink}/?from=blog/static/3046880920113802614708">${y.recommendBlogTitle|escape}</a></li>
      {/if}
    {/list}
    </ul>
    {/if}

<#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇，下一篇--> <#-- 热度 -->

{list a as x}
    {if !!x}
    <div class="hotItem iblock nbw-fce nbw-f40">
      <a class="fc03 noul" target="_blank" hidefocus="true" href="http://blog.163.com/${x.publisherUsername}/">
      {if x.publisherUsername==visitor.userName}
      <img alt="${x.publisherNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.publisherUsername)}&r=${visitor.imageUpdateTime}"/>
      {else}
      <img alt="${x.publisherNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.publisherUsername)}"/>
      {/if}
      </a>
      <div class="cwd vname thide">
        <a class="fc03 m2a"  target="_blank" hidefocus="true" href="http://blog.163.com/${x.publisherUsername}/">
          ${fn(x.publisherNickname,8)|escape}
        </a>
      </div>
      <a class="f-myLikeIcons hottype {if x.type==1} js-liketype{elseif x.type==2} js-reblogtype{elseif x.type==3} js-sharetype{else}{/if}" target="_blank" hidefocus="true" href="http://blog.163.com/${x.publisherUsername}/"> </a>
    </div>
    {/if}
    {/list}

<#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->

页脚

我的照片书 - 手机博客 - 下载LOFTER APP - 订阅此博客

导航

日志

【音画教程】多层背景边框的做法

历史上的今天

最近读者

热度

评论

页脚