加载中…
个人资料
王剑吉祥
王剑吉祥
  • 博客等级:
  • 博客积分:0
  • 博客访问:852,814
  • 关注人气:313
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
相关博文
推荐博文
谁看过这篇博文
加载中…
正文 字体大小:

表格代码大全!

(2013-07-27 22:23:43)
标签:

外阴

大全

立体

味道

单元格

分类: 吉祥道网易学院

[Css-lesson]表格特效代码全集中

1. 两种细线表格做法

各种表格代码


  源码如下:





表格边线为1,线色为黑,行线色为白。






表格边线为0,间距为1,背景色为黑,行背景色为白。


  2. 立体表格

各种表格代码



  源码如下:

border=1 cellspacing=0 width=100% bordercolorlight=#333333 bordercolordark=#efefef>












it365cn it365cn it365cn it365cn
cnbruce cnbruce cnbruce cnbruce

表格边线为1,间隔为0,左上为#333333,右下为#efefef,行背景色为#cccccc

3. 另类圆角表格制作

 

各种表格代码


  源码如下:

原图:





























放大





























4. 虚线边框表格
各种表格代码

  源码如下:






www.blueidea.com


虚线直线1



虚线直线2



5. 分类型表格

 

各种表格代码

  源码如下:


item
content



6. 变色的单元格1,通过a:hover做

各种表格代码


  源码如下:




Blueidea
.com
CNBruce
.com

7. 变色的单元格2,已经做成了CSS,注意还有透明效果

  源码如下:

 

width="100%">



onmouseover="this.className='aa'" onmouseout="this.className='bb'"
class="bb">
cnbruce



8. 变色的单元格3,通过mouse事件做.有点微软的味道

各种表格代码


  源码如下:


bordercolor="#efefef" bgcolor="#efefef">







onMouseOver="this.bgColor='#cccccc'; this.borderColor='#000033'">

Blueidea
onMouseOut="this.bgColor='#efefef';this.borderColor='#efefef'"; onMouseOver="this.bgColor='#cccccc'; this.borderColor='#000033'">
cnbruce


9. 透明表格



cnbruce


10. 表格边框显示外阴影

各种表格代码

  源码如下:

align=center width=200 height=100 bgcolor=#f3f3f3
style="filter:progid:DXImageTransform.Microsoft.Shadow
(Color=#333333,Direction=120,strength=5)">



www.cnbruce.com

11. VML代码实现的圆角表格
(1).

 

各种表格代码

  源码如下:






VML




(2).

各种表格代码

  源码如下:

xmlns:v>


style="position:relative;width:150;height:240px">
textpathok="true" />
on="true" string="cnbrucecnbrucecnbrucecnbrucecnbruc
ecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbruce" />
on="T" type="single" color="#b3b3b3" offset="3px,3px"/>
style="font-size:10.2pt;">VML




(3).

各种表格代码


  源码如下:
<html xmlns:v>
<style>
v\:*{behavior:url(#default#VML)}
</style>
<body>
<v:RoundRect style="position:relative;width:150;height:240px" arcsize=0.5>
<v:shadow on="T" type="single" color="#b3b3b3" offset="3px,3px"/>
<v:TextBox style="font-size:10.2pt;">VML</v:TextBox>
</v:RoundRect>
</body>
</html>

我的更多文章:

0

阅读 评论 收藏 转载 喜欢 打印举报/Report
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

      

    新浪BLOG意见反馈留言板 电话:4000520066 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有