html table怎么实现斜线表头

就做个如图中红线框起来那个效果。用html,css,html5,css3,这些都行,只要能写出来就行。因为是手机页面,要随着屏幕的大小而自动缩放,所以不能用图片。只用代码... 就做个如图中红线框起来那个效果。用html,css,html5,css3,这些都行,只要能写出来就行。因为是手机页面,要随着屏幕的大小而自动缩放,所以不能用图片。只用代码怎么写? 展开
 我来答
sky不用太多sky
高粉答主

2018-04-11 · 醉心答题,欢迎关注
知道大有可为答主
回答量:1082
采纳率:97%
帮助的人:48.4万
展开全部

<HTML> 

<HEAD> 

<TITLE>斜线表头</TITLE>    

</HEAD> 

<script    Language="javascript"> 

function    a(x,y,color) 

{document.write("<img    border='0'    style='position:    absolute;    left:    "+(x)+";    top:    "+(y)+";background-color:    "+color+"'    src='px.gif'    width=1    height=1>")} 

</script> 

<body    leftmargin=0    topmargin=0>    <br> 

<TABLE    border=0    bgcolor="000000"    cellspacing="1"    width=400 > 

<TR    bgcolor="FFFFFF"> 

<TD    width="111"    height="52"    ><table    width="100%"    height="100%"    border="0"    cellpadding="0"    cellspacing="0"> 

<tr> 

<td    id="td1"></td> 

<td>成绩</td> 

</tr> 

<tr> 

<td>姓名</td> 

<td id="td2"></td> 

</tr> 

</table></TD> 

<TD    width="81">数学</TD> 

<TD    width="96">英语</TD> 

<TD    width="99">C语言</TD> 

</TR> 

<TR    bgcolor="FFFFFF"> 

<TD>张三</TD> 

<TD>55</TD> 

<TD>66</TD> 

<TD>77</TD> 

</TR> 

<TR    bgcolor="FFFFFF"> 

<TD>李四</TD> 

<TD>99</TD> 

<TD>68</TD> 

<TD>71</TD> 

</TR> 

<TR    bgcolor="FFFFFF"> 

<TD>王五</TD> 

<TD>33</TD> 

<TD>44</TD> 

<TD>55</TD> 

</TR> 

</TABLE> 

<script> 

function    getTop(tdobj) 

vParent    =    tdobj.offsetParent; 

t    =    tdobj.offsetTop; 

while    (vParent.tagName.toUpperCase()    !=    "BODY") 

t    +=    vParent.offsetTop; 

vParent    =    vParent.offsetParent; 

return    t; 

function    getLeft(tdobj) 

vParent    =    tdobj.offsetParent; 

t    =    tdobj.offsetLeft; 

while    (vParent.tagName.toUpperCase()    !=    "BODY") 

t    +=    vParent.offsetLeft; 

vParent    =    vParent.offsetParent; 

return    t; 

function    line(x1,y1,x2,y2,color) 

var    tmp 

if(x1>=x2) 

tmp=x1; 

x1=x2; 

x2=tmp; 

tmp=y1; 

y1=y2; 

y2=tmp; 

for(var    i=x1;i<=x2;i++) 

x    =    i; 

y    =    (y2    -    y1)    /    (x2    -    x1)    *    (x    -    x1)    +    y1; 

a(x,y,color); 

//line(1,1,100,100,"000000"); 

line(getLeft(td1),getTop(td1),getLeft(td1)+td1.offsetWidth,getTop(td1)+td1.offsetHeight,'#000000'); 

line(getLeft(td2),getTop(td2),getLeft(td2)+td2.offsetWidth,getTop(td2)+td2.offsetHeight,'#000000'); 

</script> 

</BODY> 

</HTML>

万维网上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外语:Homepage)或首页,主页中通常包括有指向其他相关页面或其他节点的指针(超级链接),所谓超级链接,就是一种统一资源定位器(Uniform Resource Locator,外语缩写:URL)指针,通过激活(点击)它,可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。在逻辑上将视为一个整体的一系列页面的有机集合称为网站(Website或Site)。超级文本标记语言(英文缩写:HTML)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。

网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。[1] 

超级文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是,对于不同的浏览器,对同一标记符可能会有不完全相同的解释,因而可能会有不同的显示效果。

DoramiHe
2017-04-09 · 知道合伙人互联网行家
DoramiHe
知道合伙人互联网行家
采纳数:25332 获赞数:59543
2011年中山职业技术学院毕业,现担任毅衣公司京东小二

向TA提问 私信TA
展开全部
<HTML>
<HEAD>
<TITLE>斜线表头</TITLE>
</HEAD>
<script Language="javascript">
function a(x,y,color)
{document.write("<img border='0' style='position: absolute; left: "+(x)+"; top: "+(y)+";background-color: "+color+"' src='px.gif' width=1 height=1>")}
</script>

<body leftmargin=0 topmargin=0> <br>
<TABLE border=0 bgcolor="000000" cellspacing="1" width=400 >
<TR bgcolor="FFFFFF">
<TD width="111" height="52" ><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="td1"></td>
<td>成绩</td>
</tr>
<tr>
<td>姓名</td>
<td id="td2"></td>
</tr>
</table></TD>
<TD width="81">数学</TD>
<TD width="96">英语</TD>
<TD width="99">C语言</TD>
</TR>
<TR bgcolor="FFFFFF">
<TD>张三</TD>
<TD>55</TD>
<TD>66</TD>
<TD>77</TD>
</TR>
<TR bgcolor="FFFFFF">
<TD>李四</TD>
<TD>99</TD>
<TD>68</TD>
<TD>71</TD>
</TR>
<TR bgcolor="FFFFFF">
<TD>王五</TD>
<TD>33</TD>
<TD>44</TD>
<TD>55</TD>
</TR>
</TABLE>
<script>
function getTop(tdobj)
{
vParent = tdobj.offsetParent;
t = tdobj.offsetTop;
while (vParent.tagName.toUpperCase() != "BODY")
{
t += vParent.offsetTop;
vParent = vParent.offsetParent;
}
return t;
}

function getLeft(tdobj)
{
vParent = tdobj.offsetParent;
t = tdobj.offsetLeft;
while (vParent.tagName.toUpperCase() != "BODY")
{
t += vParent.offsetLeft;
vParent = vParent.offsetParent;
}
return t;
}
function line(x1,y1,x2,y2,color)
{
var tmp
if(x1>=x2)
{
tmp=x1;
x1=x2;
x2=tmp;
tmp=y1;
y1=y2;
y2=tmp;
}
for(var i=x1;i<=x2;i++)
{
x = i;
y = (y2 - y1) / (x2 - x1) * (x - x1) + y1;
a(x,y,color);
}
}
//line(1,1,100,100,"000000");
line(getLeft(td1),getTop(td1),getLeft(td1)+td1.offsetWidth,getTop(td1)+td1.offsetHeight,'#000000');
line(getLeft(td2),getTop(td2),getLeft(td2)+td2.offsetWidth,getTop(td2)+td2.offsetHeight,'#000000');
</script>
</BODY>
</HTML>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
greystar_cn
2015-06-18 · 知道合伙人软件行家
greystar_cn
知道合伙人软件行家
采纳数:16407 获赞数:17261
本人主要从事.NET C#方向的技术开发工作,具有10多年的各类架构开发工作经验。

向TA提问 私信TA
追问
不管用,他的代码打开后那条斜线就不见了。网上的资料我大多数看过了,用js等实现都太复杂了,有没有别的一些方法或思路?
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式