html - 如何从html表格中删除垂直线?

标签 html css

嗨,我想从 html 表格中删除垂直线,并且只有特定的垂直线要在我的 html 表格中删除,只有 3 条垂直线,我只想删除 1 和 3 行

这是我的代码

<html>
<head>
<style type="text/css">
.table1{

 background: -moz-linear-gradient(-90deg, #003471, #448CCB);
 background: -webkit-gradient(linear, left top, left bottom, from(#003471), to(#448CCB));

}
table, th, td {
  border-left: none;
  border-right: none;
}
</style>
</head>
<body>
   <div id="div1" class='display'>

           <table  width="100%" border="1" align="center" cellpadding="0" cellspacing="1" bordercolor='66A8FF'>
           <tr class="table1" style="border-collapse:collapse">
           <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text1</font></td>   
           <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text2</font></td>
            <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text3</font></td>  
             <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text4</font></td>   
            </tr>
            <tr class="table1" style="border-collapse:collapse">
           <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text1</font></td>   
           <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text2</font></td>
            <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text3</font></td>  
             <td  width="25%"  height="48px" align="center" style="font-size:28px"><font color="#fff">Text4</font></td>   
            </tr>
            </table>
               </div>
</body>
</html>

这是我的 JSFiddle

我怎样才能实现我的目标

提前致谢

最佳答案

Demo Fiddle

使用CSS:

table{
    border-collapse:collapse;
}
td:nth-child(2){
    border-right:1px solid white;
}

关于html - 如何从html表格中删除垂直线?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23561585/

相关文章:

javascript - jQuery/CSS : fixed overlay should not allow scrolling of background?

javascript - 用 unicode 替换\n 以正确显示 html 中的新行

html - 背景图片在手机上无法完全显示

html - Mobile Safari 5mb HTML5 应用程序缓存限制?

java - 将变量从 HTML 传递到 Java(JSP)

css - IE 7 而非 IE8 的动画问题

html - 等效于内联图像的背景位置

javascript - 网页包 1.12 : Bundle css files

javascript - 如何换行文本以适合 DIV 长度

html - 调整窗口大小时,无法防止导航栏中的最后一项掉落到下一行?