表格边框左下角

时间:2013-01-26 10:05:26

标签: html html-table

我需要根据以下示例创建边框。

HTML:

<table width="770">
  <tr>
    <td>picture (border only to the left and bottom ) </td>
    <td>text</td>
  </tr>
  <tr>
    <td>text</td>
    <td>picture (border only to the left and bottom) </td>
  </tr>
</table>

3 个答案:

答案 0 :(得分:16)

您可以使用以下样式:

style="border-left: 1px solid #cdd0d4;"  
style="border-bottom: 1px solid #cdd0d4;"
style="border-top: 1px solid #cdd0d4;"
style="border-right: 1px solid #cdd0d4;"

用这个你想要你必须使用

<td style="border-left: 1px solid #cdd0d4;border-bottom: 1px solid #cdd0d4;">  

<img style="border-left: 1px solid #cdd0d4;border-bottom: 1px solid #cdd0d4;"> 

答案 1 :(得分:4)

提供课程.border-lb并提供此CSS

.border-lb {border: 1px solid #ccc; border-width: 0 0 1px 1px;}

和HTML

<table width="770">
  <tr>
    <td class="border-lb">picture (border only to the left and bottom ) </td>
    <td>text</td>
  </tr>
  <tr>
    <td>text</td>
    <td class="border-lb">picture (border only to the left and bottom) </td>
  </tr>
</table>

截图

小提琴:http://jsfiddle.net/FXMVL/

答案 2 :(得分:0)

您需要使用border属性,如下所示:jsFiddle

HTML:

<table width="770">
    <tr>
        <td class="border-left-bottom">picture (border only to the left and bottom ) </td>
        <td>text</td>
    </tr>
    <tr>
        <td>text</td>
        <td class="border-left-bottom">picture (border only to the left and bottom) </td>
    </tr>
</table>`

CSS:

td.border-left-bottom{
    border-left: solid 1px #000;
    border-bottom: solid 1px #000;
}