padding 是纯 css 属性，必须通过 style 属性或样式表设置，如 style="padding:12px;"，html 标签不支持 padding 属性；常用单值、双值、四值写法，单位建议统一用 em/rem；它影响内容区到边框距离且受背景色填充，与 margin 有本质区别。
padding 在 HTML 中根本不存在
HTML 标签本身不处理 padding，它只是结构容器。真正控制内边距的是 CSS —— 你写在 <style></style> 里、style 属性中，或者外部样式表里的规则。
常见错误现象：<div padding="10"> 或 <code><p padding-left="20px"></p> 这类写法完全无效，浏览器直接忽略，连警告都不会抛。
-
padding是纯 CSS 属性，必须配合选择器使用，比如div { padding: 10px; } - HTML 中只有极少数全局属性（如
class、id、style）能间接影响样式，但padding不在其中 - 如果用
style属性写，得是style="padding: 12px;"，不是padding="12"
怎么给元素加 padding：最常用三种写法
实际开发中，padding 值的写法直接影响可维护性和响应行为，别只图快写死数字。
- 单值写法：
padding: 8px;→ 四边都是 8px - 双值写法：
padding: 10px 16px;→ 上下 10px，左右 16px - 四值写法：
padding: 4px 8px 12px 6px;→ 顺时针：上右下左 - 用
em或rem更适配字体缩放，比如padding: 0.5em 1em; - 避免混用单位（如
padding: 10px 1em;），容易在缩放或动态字体场景下错位
padding 和 margin 容易搞混的边界问题
很多人调了半天布局，发现元素没“撑开”或“叠在一起”，其实是把 padding 当成了 margin，或者反过来。
-
padding是内容区到边框的距离，会受background-color影响（背景会填满 padding 区） -
margin是边框外的空白，背景色不延伸过去 - 父容器没有设置
height时，子元素的padding-top不会撑高父容器，但margin-top可能触发外边距合并（margin collapse） - 用浏览器开发者工具选中元素，看“Computed”面板里的
padding和margin分区，比猜靠谱得多
flex 或 grid 容器里 padding 的特殊表现
当元素是 display: flex 或 display: grid 容器时，padding 依然生效，但它只作用于容器自身的内容区域，不影响子项排列逻辑。
- 容器的
padding会为子项“留白”，但子项默认不会自动避开它（除非用align-items: stretch且子项没设高度） - 想让子项内容对齐 padding 边界？通常要配合
justify-content/align-items，而不是靠 padding 撑 - 注意：IE11 对
padding在flex容器中的解析有兼容性偏差，比如padding-bottom可能被忽略
