注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

聚铭宝欢迎你

愿缘分这根无形的线将我们系在一起!

 
 
 

日志

 
 

【转载】给你的网易博客日志添加个性漂亮的边框表格效果  

2014-01-27 13:24:53|  分类: 《博客装扮素材》 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

给你的网易博客日志添加个性漂亮的边框表格效果 - 宁静 - 乡下人家

 

样式多多 大家自由选择发挥!

样式1

 

代码如下:

<table style="border:2px dotted royalblue;" cellpadding="4" cellspacing="4">

<tr><td style="border:2px dotted lightblue;">

<font size="2">在这里输入文字</td></tr></table>

样式2

 

代码如下:

<table style="border:2px dotted hotpink;" cellpadding="4" cellspacing="4">

<tr><td style="border:2px dotted deepskyblue;">

<font size="2">在这里输入文字</font></td></tr>

</table>

样式3

 

代码如下:

<table style="border:1px dashed deepskyblue;" cellspacing="5"

bgcolor="deepskyblue" cellpadding="5"><tr><td style="border:1px dashed white;"

bgcolor="white">

<font size="2">在这里输入文字</font>

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

</tr>

</table>

样式4

 

代码如下:

<table cellpadding="4" cellspacing="0" style="border:double 5px plum;">

<tr><td style="border:double 5px lightblue;">

<font size="2">在这里输入文字 </font>

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

样式5

 

代码如下:

<table style="border-right: dodgerblue 3px double;

border-top: dodgerblue 3px double;

border-left: dodgerblue 3px double;border-bottom:

dodgerblue 3px double" cellSpacing="0"

cellPadding="0">

<tr><td>

<table style="border-right: lightblue 3px double;

border-top: lightblue 3px double;

border-left: lightblue 3px double;

border-bottom: lightblue 3px double" cellPadding="0">

<tr><td>

<table style="border-right: dimgray 1px solid;

border-top: dimgray 1px solid;

border-left: dimgray 1px solid; border-bottom:

dimgray 1px solid; background-color: white"

cellPadding="7">

<tr><td><font size="2">在这里输入文字

</font></td>

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

</table></td>

</tr></table>

样式6

 

代码如下:

<table style="border-right: lightblue 3px double;

border-top: lightblue 3px double;

border-left: lightblue 3px double;

border-bottom: lightblue 3px double" height="100"

cellPadding="2" width="150">

<tr><td style="border-right: plum 3px double;

border-top: plum 3px double; border-left:

plum 3px double; border-bottom: plum 3px double;

background-color: aliceblue">

<p align="center">在这里输入内容</td></tr></table>

 

样式7

 

代码如下:

<table style="border-right: plum 1px solid;

border-top: plum 1px solid; border-left:

plum 1px solid; border-bottom:plum 1px solid"

height="100" cellPadding="5"

width="100" bgcolor="#eee0e5"><tr>

<td style="border-right: orchid 4px dotted;

border-top: orchid 4px dotted;

border-left: orchid 4px dotted;border-bottom:

orchid 4px dotted" bgcolor="white">

<font size="2">在这里输入内容</font>

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

样式8

 

代码如下:

<table style="border-right:

lightblue 1px dashed; border-top:

lightblue 1px dashed;

border-left: lightblue 1px dashed;

border-bottom: lightblue 1px dashed"

cellSpacing="5" cellPadding="3"

bgcolor="lightblue">

<tr><td style="border-right: lightcyan

1px dashed; border-top: lightcyan 1px

dashed;

border-left: lightcyan 1px dashed;

border-bottom: lightcyan 1px dashed"

bgcolor="lightcyan">

<table><tr>

<td style="PADDING-RIGHT: 6px;

padding-left: 6px; PADDING-BOTTOM: 6px;

padding-top: 6px" bgcolor="white">

<font size="2">在这里输入文字

</font></td></tr>

</table>

</td>

</tr></table>

样式9

 

代码如下:

<table style="border-right:

lightblue

1px dashed; border-top: lightblue

1px dashed;

border-left: lightblue 1px dashed;

border-bottom: lightblue 1px dashed"

cellSpacing="3" cellPadding="4"

bgcolor="lightblue"><tr>

<td style="border-right: white

1px dashed; border-top: white 1px dashed;

border-left: white 1px dashed;

border-bottom: white 1px dashed">

<font size="2">在此输入内容

</font></td>

</tr></table>

样式10

 

代码如下:

<table width="400" style="border-style:solid; border-color:#ff99cc; border-width:1px;">

<tr><td align="center" style="border-style:dashed; border-color:#ff99cc;

border-width:1px;">输入文字</td></tr></table>

样式11

 

代码如下:

<table width="400" style="border-color:#ff99cc; border-width:4px;

border-style:dotted;"><tr><td align="center">输入文字</td></tr></table>

样式12

 

代码如下:

<table width="400" style="border-color:#ff99cc; border-width:2px;

border-style:dotted;"><tr><td align="center">输入文字</td></tr></table>

样式13

 

代码如下:

<table width="400" style="border-color:#ff99cc; border-width:4px; border-style:double;">

<tr><td align="center">输入文字</td></tr></table>

样式14

 

代码如下:

<table width="400" style="border-color:#ff99cc; border-width:4px;

border-style:dashed;"><tr><td align="center">输入文字</td></tr></table>

样式15

 

代码如下:

<table border="0" cellpadding="8" cellspacing="3"

width=400>

<tbody><tr><td height="1" bgcolor="#ff99cc"></td>

</tr>

<tr>

<td height="1" bgcolor="#ffb9dc">

</td></tr><tr><td height="1" bgcolor="#ffddee"></td>

</tr>

<tr>

<td width="140" align="center" style="font-size:8pt;

color:#bbbbbb;">

<font size="2" color="#000000">输入文字</font></td>

</tr><tr><td

height="1" bgcolor="#ffddee">

</td></tr>

<tr>

<td height="1" bgcolor="#ffb9dc">

</td></tr><tr>

<td height="1" bgcolor="#ff99cc">

</td>

</tr>

</tbody>

</table>

样式16

 

代码如下:

<table border="0" cellspacing="0" cellpadding="5" width=400>

<tr>

<td width="10" height="10" style="border-bottom:1px dotted #ff99cc;border-right:1px

dotted #ff99cc;font-size:1pt"> </td>

<td height="10" style="border-bottom:1px dotted #ff99cc;font-size:1pt"> </td>

<td width="10" height="10" style="border-bottom:1px dotted #ff99cc;border-left:1px

dotted #ff99cc;font-size:1pt"> </td>

</tr>

<tr>

<td width="10" style="border-right:1px dotted #ff99cc;font-size:1pt"> </td>

<td width="120" bgcolor="#ffffff" style="font-size:8pt;color:#999999;">

<p align="center"><br>

<font size="2" color="#000000">输入文字</font><br>

<br>

</td>

<td width="10" style="border-left:1px dotted #ff99cc;font-size:1pt"> </td>

</tr>

<tr>

<td width="10" height="10" style="border-top:1px dotted #ff99cc;border-right:1px

dotted #ff99cc;font-size:1pt"> </td>

<td height="10" style="border-top:1px dotted #ff99cc;font-size:1pt"> </td>

<td width="10" height="10" style="border-top:1px dotted #ff99cc;border-left:1px

dotted #ff99cc;font-size:1pt"> </td>

</tr>

</table>

网易博客添加边框效果的方法

首先登陆你的网易博客

点击写日志

点击写日志的全部功能

给你的网易博客日志添加个性漂亮的边框表格效果 - 宁静 - 乡下人家

 

点击代码符号:

给你的网易博客日志添加个性漂亮的边框表格效果 - 宁静 - 乡下人家

 

在空白地方粘贴你喜欢的边框效果代码

给你的网易博客日志添加个性漂亮的边框表格效果 - 宁静 - 乡下人家

 

把代码中的“在这里输入文字”改成你自己想写在日志的文字

如下效果:

给你的网易博客日志添加个性漂亮的边框表格效果 - 宁静 - 乡下人家

  评论这张
 
阅读(32)| 评论(0)
推荐

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017