What does padding mean in css-CSS Tutorial-php.cn

What does padding mean in css

青灯夜游

Release： 2023-01-06 11:13:43

Original

29903 people have browsed it

In CSS, padding means "filling" or "padding", which is used to define the space between the element border and the element content, that is, the padding of the element. padding is a shorthand property that can set the width of all padding on an element, or set the width of padding on each side.

What does padding mean in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

What does padding mean in css

CSS padding

CSS padding is a shorthand property that defines the space between the element border and the element content space, that is, the padding of the element.

What does padding mean in css

When an element's padding is cleared, the freed area will be filled with the element's background color.

Use the padding attribute alone to change the top, bottom, left, and right padding.

Description:

This shorthand attribute sets the width of all padding of the element, or sets the width of the padding on each side. Padding set on inline, non-replaced elements does not affect line height calculations; therefore, if an element has both padding and a background, it may visually extend into other lines and possibly overlap other content. . The element's background extends across the padding. Negative margin values are not allowed.

Padding attribute can have one to four values.

padding:25px 50px 75px 100px;

Copy after login

The top padding is 25px
The right padding is 50px
The bottom padding is 50px 75px
Left padding is 100px

padding:25px 50px 75px;

Copy after login

Top padding is 25px
The left and right padding is 50px
The bottom padding is 75px

padding:25px 50px;

Copy after login

The top and bottom padding is 25px
Padding left and right is 50px

padding:25px;

Copy after login

All padding is 25px

Example :

<html>
<head>
<style type="text/css">
td.test1 {padding: 1.5cm}
td.test2 {padding: 0.5cm 2.5cm}
</style>
</head>

<body>
<table border="1">
<tr>
<td class="test1">
这个表格单元的每个边拥有相等的内边距。
</td>
</tr>
</table>
<br />
<table border="1">
<tr>
<td class="test2">
这个表格单元的上和下内边距是 0.5cm，左和右内边距是 2.5cm。
</td>
</tr>
</table>
</body>

</html>

Copy after login

What does padding mean in css

Learning video sharing: css video tutorial

The above is the detailed content of What does padding mean in css. For more information, please follow other related articles on the PHP Chinese website!