码迷,mamicode.com
首页 > 其他好文 > 详细

单元格之间的空隙

时间:2018-08-08 18:12:53      阅读:132      评论:0      收藏:0      [点我收藏+]

标签:one   Edito   ini   title   情况   set   file   增加   license   

border-spacing属性允许你控制相邻单元格之间的距离。默认情况下,浏览器经常在每个单元格之间留有一个较小的空隙,如果你想增加或者减小这个空隙可以利用border-spacing属性来控制。

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style type="text/css">
            td {
               background-color: #0088dd;
               padding: 15px;
               border: 2px solid #000000;}
            table.one {
                border-spacing: 5px 15px;
            }
            table.two {
                border-collapse: collapse;
            }
        </style>
    </head>
    <body>
        <div>TODO write content</div>
       <table class="one">
           <tr>
               <td>1</td>
               <td>2</td>
           </tr>
           <tr>
               <td>3</td>
               <td>4</td>
           </tr>
      <table class="two">
           <tr>
               <td>1</td>
               <td>2</td>
           </tr>
           <tr>
               <td>3</td>
               <td>4</td>
           </tr>
       </table>
    </body>
</html>

 

单元格之间的空隙

标签:one   Edito   ini   title   情况   set   file   增加   license   

原文地址:https://www.cnblogs.com/q2546/p/9444289.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!