table表格填充斜线

最新推荐文章于 2023-12-15 16:44:14 发布

手撕妹子

最新推荐文章于 2023-12-15 16:44:14 发布

阅读量2.2k

点赞数

分类专栏：苦逼的前端文章标签： html JavaScript CSS 前端 table

本文链接：https://blog.csdn.net/qq_31678399/article/details/101218565

版权

起初是为了帮朋友做这个东西，因为他说只是单纯的表格，所以不敢用太多的插件，外带考虑兼容性的问题，强行用js做了。

在网上找了找，前辈的原文使用:before的css样式（建议瞅一眼）。

因为td的长和宽、窗口的大小可能不是固定的，所以css里面写死了肯定不行，于是想到了用js改变css的样式，研究了半天没研究出来，后来发现了用js新增css样式的方式，磨叽磨叽就成了下面这样子。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>td加斜线</title>
<style>
table{
border-collapse:collapse;
}
table,tr,td{
border:1px solid black;
}
td{
width:300px; 
height:100px; 
position: relative;
}

</style>
</head>

<body onresize=>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
<th style="width:444px">性别</th>
</tr>
<tr>
<td class="fillSlash"></td>
<td></td>
<td class="fillSlash">&l

最低0.47元/天解锁文章

手撕妹子

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
table表格填充斜线

起初是为了帮朋友做这个东西，因为他说只是单纯的表格，所以不敢用太多的插件，外带考虑兼容性的问题，强行用js做了。在网上找了找，前辈的原文使用:before的css样式（https://www.cnblogs.com/zyl-Tara/p/6139194.html），因为td的长和宽、窗口的大小可能不是固定的，所以css里面写死了肯定不行，于是想到了用js改变css的样式，研究了半天没研究出来，后...
复制链接

扫一扫