打印

[求助] 表格中的这个效果CSS如何实现?

chenggengxin [楼主]

中级会员

帖子: 412
体力: 498
威望: 0
当前: 河北沧州

专长 网页设计,前端制作,SEO

1^# 大中小发表于 2008-6-3 10:08

各位好:

有一个小问题,请指点一下,表格中左上角的这个单元格中的效果,CSS如何实现?

附件: 您所在的用户组无法下载或查看附件，您需要注册/登录后才能查看！

www.lsok.net 应无所住而生其心.

TOP

做西部数码代理.Cn1元国际45元 | 将虚拟化进行到底

zoloadang

古斯比德

银牌会员

帖子: 559
体力: 1253
威望: 2
当前: 浙江杭州
离线: 2 天

专长 网页设计,Flash,.NET

2^# 大中小发表于 2008-6-3 10:11

背景background

TOP

美橙vps独立IP月付189元

marvellous

金翅擘海

版主

帖子: 11549
体力: 26645
威望: 140
当前: 北京朝阳区

3^# 大中小发表于 2008-6-3 12:00

表格中的斜线部分可用Word OR VML生成。

┏┯┓┏┯┓┏┯┓┏┯┓
┠知┨┠往┨┠观┨┠来┨
┗┷┛┗┷┛┗┷┛┗┷┛

TOP

中央美院远程平面设计进修班

cycloned

程让

金牌会员

帖子: 1381
体力: 3213
威望: 0
当前: 上海浦东
离线: 3 天

专长 网页设计,前端制作,UE

4^# 大中小发表于 2008-6-3 12:39

顺便问下楼上的大大，Word 生成的东西直接拷到DW里可以？还是Word 也有代码模式可以拷贝？

前端开发

TOP

还在为头像烦恼?还在为不能关注好友动态烦忧?快来蓝色理想家园吧!

chenggengxin [楼主]

中级会员

帖子: 412
体力: 498
威望: 0
当前: 河北沧州

专长 网页设计,前端制作,SEO

5^# 大中小发表于 2008-6-4 08:31

多谢版主!

不过,能否再详细说明一下,WORD中不知如何作这个斜线效果最好。

www.lsok.net 应无所住而生其心.

TOP

snowshade

雪殇

中级会员

帖子: 136
体力: 296
威望: 0
当前: 广东汕头
离线: 4 天

专长 网页设计,前端制作,ASP

6^# 大中小发表于 2008-6-4 10:44

在word的表格菜单中有一个绘制斜线表头，里面可以绘制。
我记得word是不能直接复制的,会生成很多的代码...

www.gaths.net

TOP

erroringldh

中级会员

帖子: 195
体力: 395
威望: 0
离线: 3 天

7^# 大中小发表于 2008-6-4 17:17

我也期待好方法！

TOP

marvellous

金翅擘海

版主

帖子: 11549
体力: 26645
威望: 140
当前: 北京朝阳区

8^# 大中小发表于 2008-6-6 00:33

引用:

原帖由 cycloned 于 2008-6-3 12:39 发表
顺便问下楼上的大大，Word 生成的东西直接拷到DW里可以？还是Word 也有代码模式可以拷贝？

Word文件可以另存为网页文件格式。
另外，可用VML工具作出斜线：

<HTML xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<HEAD>
<META name="Gemeratpr" content="FlashVml(璀灿之星)4.0">
<META http-equiv="Content-Type" content="text/html;charset=gb2312">
<META name="KeyWords" content="我的作品flashvml-璀灿之星-璀灿之星-vml极道教程-vml-vmlflash-沐缘华-FYW-lshdic-风云舞">
<TITLE>我的作品</TITLE>
<STYLE>
v\:*{behavior:url(#default#VML);position:absolute;}
o\:*{behavior:url(#default#VML);}
</STYLE>
<script>
function window.onerror(){return true;}  //防止您的程序出现错误时弹出提示
</script>
</HEAD>
<BODY bgcolor="#ffffff" style='scrollbar-base-color:purple;scrollbar-shadow-color:white;scrollbar-highlight-color:white;scrollbar-arrow-color:white;filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=green,endColorStr=cyan);'>
<bgsound loop=1 id=bgsound1>
<bgsound loop=-1 id=bgsound2>
<script>
//启动更新函数,更新所有使用隐藏功能的物件初期视图
var loadtime=null,loadtext='if(document.readyState!="complete"){window.status=window.status+"."}else{clearInterval(loadtime);window.status=""}';
window.status='相关数据资源正在加载，请等待'
loadtime=setInterval(loadtext,200)
function window.onload(){
}
</script>
<v:roundrect id=vml0 style="Z-INDEX:3003;LEFT:352;WIDTH:305;TOP:69;HEIGHT:417" arcsize="9830f" filled="t" fillcolor="#6fbe16" stroked="f" strokecolor="#f98a39" strokeweight="1px">
<v:fill type="gradientRadial" opacity="1" color2="white"/>
<v:stroke opacity="1" startarrow="none" endarrow="none"/>
</v:roundrect>
<v:rect id=vml1 style="Z-INDEX:3004;LEFT:406;WIDTH:199;TOP:145;HEIGHT:105" filled="t" fillcolor="red" stroked="t" strokecolor="#3b86e7" strokeweight="1px">
<v:fill type="gradientRadial" opacity=".5" color2="white" angle="0"/>
<v:stroke opacity="1" startarrow="none" endarrow="none"/>
</v:rect>
<v:rect id=vml2 style="Z-INDEX:3004;LEFT:406;WIDTH:199;TOP:251;HEIGHT:105" filled="t" fillcolor="#4c16d3" stroked="t" strokecolor="#f92653" strokeweight="1px">
<v:fill type="gradientRadial" opacity=".5" color2="white"/>
<v:stroke opacity="1" startarrow="none" endarrow="none"/>
</v:rect>
<v:line id=vml6 style="Z-INDEX:3020;LEFT:407;TOP:145" from="0,0" to="149.25pt,78.75pt" stroked="t" strokecolor="#4c16d3" strokeweight="1px">
<v:stroke opacity="1" startarrow="none" endarrow="none" dashstyle="dashDot"/>
</v:line>
<v:line id=vml7 style="Z-INDEX:3021;LEFT:606;TOP:251" from="0,0" to="-149.25pt,78.75pt" stroked="t" strokecolor="#f92653" strokeweight="1px">
<v:stroke opacity="1" startarrow="none" endarrow="none" dashstyle="dashDot"/>
</v:line>
<SCRIPT>  //以下程序快速执行使预隐藏图形及时隐藏
try{var bodyobjs=document.body.children;for(i=0;i<bodyobjs.length;i++){
if(bodyobjs[i].ych!=null)bodyobjs[i].style.display='none';
if(bodyobjs[i].tagName=="group"){
bodyobjs[i].contentEditable=false;
for(r=0;r<bodyobjs[i].children.length;r++){if(bodyobjs[i].children[r].ych!=null)bodyobjs[i].children[r].style.display='none';}
}
}}catch(e){}
</SCRIPT>
</BODY>
</HTML>

提示：您可以先修改部分代码再运行

[ 本帖最后由 marvellous 于 2008-6-6 00:38 编辑 ]

┏┯┓┏┯┓┏┯┓┏┯┓
┠知┨┠往┨┠观┨┠来┨
┗┷┛┗┷┛┗┷┛┗┷┛

TOP

iHack520

初级会员

帖子: 38
体力: 88
威望: 0
当前: 湖南长沙
离线: 5 天

专长 SEO

9^# 大中小发表于 2008-6-6 02:45

cool..

katu98.cn

TOP

Ashung

中级会员

帖子: 207
体力: 422
威望: 4
当前: 福建厦门
离线: 33 天

10^# 大中小发表于 2008-6-6 09:20

SVG

TOP

coli

初级会员

帖子: 40
体力: 105
威望: 0
当前: 广东珠海
离线: 15 天

11^# 大中小发表于 2008-6-6 09:28

回复 marvellous 在 8# 的帖子

不错.

TOP

0yun123

纯真

银牌会员

帖子: 1418
体力: 1814
威望: 4
当前: 福建厦门

专长 网页设计,UI,策划

12^# 大中小发表于 2008-6-6 09:29

8楼好强！
如果不用到脚本能否实现？

我的BLOG

TOP

coli

初级会员

帖子: 40
体力: 105
威望: 0
当前: 广东珠海
离线: 15 天

13^# 大中小发表于 2008-6-6 09:32

样式表.bottom * 与.bottom有什么区别

定义样式表,定义一个.bottom * 和.bottom时有什么区别?

TOP

0yun123

纯真

银牌会员

帖子: 1418
体力: 1814
威望: 4
当前: 福建厦门

专长 网页设计,UI,策划

14^# 大中小发表于 2008-6-6 09:42

回复 coli 在 13# 的帖子

CSS hack

加上*是只有IE能识别，FF不能识别。

不好意思我看错了，真是误人子弟。

[ 本帖最后由 0yun123 于 2008-6-6 10:24 编辑 ]

我的BLOG

TOP

phantom

林小志

版主

帖子: 1435
体力: 1687
威望: 4
当前: 广东深圳
离线: 1 天

专长 网页设计,前端制作

15^# 大中小发表于 2008-6-6 10:50

提示：您可以先修改部分代码再运行

总结：用图片吧……折腾人啊。

重构页面之前先重构自我

TOP

fuguojian1988

天天向网NET

银牌会员

帖子: 937
体力: 1900
威望: 0
当前: 河南商丘

专长 网页设计,平面,前端制作

16^# 大中小发表于 2008-6-6 17:25

小志版主那斜线图片挺粗滴

一个人的路，还是一个人走！

TOP