六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 150|回复: 0

table表格中画斜线

[复制链接]

升级  63.33%

41

主题

41

主题

41

主题

秀才

Rank: 2

积分
145
 楼主| 发表于 2013-2-8 00:15:41 | 显示全部楼层 |阅读模式
在html、jsp中经常用到table,但在table中如何实现标题表格中画斜线的操作呢?从网上查了很多资料,可以实现的方法有好几种,现在提供一种简单的操作方法,而且不用考虑分辨率的问题,方法如下:
 
该方法,实现的不是纯粹的在table中画斜线,而是实现两种颜色的对比,实现出有斜线的感觉:
<style>
/*对角钱矩形宽度为50,高度为100,分别对应border-top和border-left两个属性来设定*/
         .d1{border-top:100px threedlightshadow  solid;border-left:120px windowframe  solid;width:0;height:0;position:relative;color:#FFF}
         span{display:block;width:40px}
         .s1{position:absolute;top:-70px;left:-44px;color:black;}
         .s2{position:absolute;bottom:8px;right:55px}
</style>
 
   <div class="d1">
   <span class="s1">专业</span>

   <span class="s2">项目</span>

   </div>
 
由于插入不了图片,现在无法查看效果,不过如果对你有帮助,你可以实现看看!
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表