Question

我有一个html表#ols_tbl，我试图在class =“td_double”的几个特定td的底部找到一个双边框。

#ols_tbl {
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
}

#ols_tbl .td_double {    
    border-bottom: double;
    border-bottom-color: #000000;    
    border-bottom-style: double;
    border-bottom-width: 1px;
}

但是，我只能得到一行，为什么这不起作用？

Answer 1

尝试增加border-width。通常你需要3px。每个边框一个像素，加上间隙的一个像素空间。

Answer 2

你的边框没有明显加倍，因为它的宽度只有1像素。当它们被限制在1px空间内时，您无法明显区分两条1px线。至少你必须将宽度改为3px：

#ols_tbl .td_double {    
    border-bottom-color: #000000;    
    border-bottom-style: double;
    border-bottom-width: 3px;
}

或者简单地说：

#ols_tbl .td_double {    
    border-bottom: 3px double #000;
}

这是一个JSFiddle demo来证明这一点。

CSS：td上的双边框显示为单边框

2 个答案: