The CSS padding properties define the space between the element border and the element content.
CSS填充属性定元素边框到内部内容间的距离
设置左填充 Set the left padding
This example demonstrates how to set the left padding of a tablecell.
Examples 实例:
| 以下是代码片段: <html> <head> <style type="text/css"> td {padding-left: 2cm} </style> </head> <body> <table border="1"> <tr> <td> This is a tablecell with a left padding. This is a tablecell with a left padding. </td> </tr> </table> </body> </html> |
学K4网9k页6S5网(http://www.xwangye.com)
只要将上一个例子的td的样式改为 "padding-right:2cm"即可设置右填充。
只要将上一个例子的td的样式改为 "padding-top:2cm"即可设置上填充。
只要将上一个例子的td的样式改为 "padding-bottom:2cm"即可设置下填充。
快速设置4个填充
学K4网9k页6S5网(http://www.xwangye.com)
其实我们可以使用一条语句对四个填充进行设置例如:
学K4网9k页6S5网(http://www.xwangye.com)
| 以下是代码片段: td{padding:2cm 3cm 4cm 5cm;} |
学K4网9k页6S5网(http://www.xwangye.com)
说明:这四个值是按照上填充开始,以顺时针方向的四个填充,即依次为 上填充(2cm) 右填充(3cm) 下填充(4cm)和左填充(5cm)
学K4网9k页6S5网(http://www.xwangye.com)
学K4网9k页6S5网(http://www.xwangye.com)
当然这里我们也可以接收3个值的设置如下:
学K4网9k页6S5网(http://www.xwangye.com)
| 以下是代码片段: td{padding:2cm 3cm 4cm;} |
学K4网9k页6S5网(http://www.xwangye.com)
说明:上填充(2cm) 左右填充(3cm) 下填充(4cm)
学K4网9k页6S5网(http://www.xwangye.com)
我们也可以设置2个值如下:
学K4网9k页6S5网(http://www.xwangye.com)
| 以下是代码片段: td{padding:2cm 3cm;} |
学K4网9k页6S5网(http://www.xwangye.com)
说明: 上下填充(2cm) 左右填充(3cm)
学K4网9k页6S5网(http://www.xwangye.com)
当然我们也可以只设置一个值,示例代码如下:
学K4网9k页6S5网(http://www.xwangye.com)
| 以下是代码片段: td{padding:2cm} |
学K4网9k页6S5网(http://www.xwangye.com)
说明:四周填充都为2cm.
学K4网9k页6S5网(http://www.xwangye.com)
学K4网9k页6S5网(http://www.xwangye.com)
总结:The CSS padding properties define the space between the element border and the element content. Negative values are not allowed. The top, right, bottom, and left padding can be changed independently using separate properties. A shorthand padding property is also created to control multiple sides at once.
可用padding属性快速设置各方向填充的属性 <!--em336tj start--><!--em336tj end-->
学K4网9k页6S5网(http://www.xwangye.com)

当前 位置: 
