CSS学习Day06

最新推荐文章于 2024-09-21 23:59:03 发布

不是艳阳

最新推荐文章于 2024-09-21 23:59:03 发布

阅读量239

点赞数

分类专栏： Html CSS 文章标签： css

本文链接：https://blog.csdn.net/buruoyanyang/article/details/53998840

版权

CSS 同时被 2 个专栏收录

9 篇文章 0 订阅

订阅专栏

Html

8 篇文章 0 订阅

订阅专栏

设置内边距

<html>
 <head> 
  <style type="text/css">
td
{
padding-left: 10%
}
</style> 
 </head> 
 <body> 
  <table border="1"> 
   <tbody>
    <tr> 
     <td> 这个表格单元拥有左内边距。 </td> 
    </tr> 
   </tbody>
  </table>   
 </body>
</html>

之前提到了设置外边距，我们也可以设置内边距，我们可以使用padding-left设置左边距是多少，同理也可以使用cm，%单位来设置。
以下是将所有的属性放在一起的写法：

<html>
 <head> 
  <style type="text/css">
td.test1 {padding: 1.5cm}
td.test2 {padding: 0.5cm 2.5cm}
</style> 
 </head> 
 <body> 
  <table border="1"> 
   <tbody>
    <tr> 
     <td class="test1"> 这个表格单元的每个边拥有相等的内边距。 </td> 
    </tr> 
   </tbody>
  </table> 
  <br /> 
  <table border="1"> 
   <tbody>
    <tr> 
     <td class="test2"> 这个表格单元的上和下内边距是 0.5cm，左和右内边距是 2.5cm。 </td> 
    </tr> 
   </tbody>
  </table>   
 </body>
</html>