css 缩进

作者：看不见相思意发布日期:2026-02-09 浏览:108

/* 示例代码：使用 CSS 实现缩进效果 */

/* 1. 文本首行缩进 */
p {
    text-indent: 2em; /* 首行缩进 2 个字符宽度 */
}

/* 2. 使用 margin 实现块级元素缩进 */
.block {
    margin-left: 20px; /* 左侧缩进 20 像素 */
    margin-right: 20px; /* 右侧缩进 20 像素 */
}

/* 3. 使用 padding 实现内容区域缩进 */
.content {
    padding-left: 20px; /* 内容左侧缩进 20 像素 */
    padding-right: 20px; /* 内容右侧缩进 20 像素 */
}

解释说明：

text-indent：用于设置文本的首行缩进，常用于段落的排版。2em 表示首行缩进 2 个字符宽度。
margin：用于设置元素外部的缩进，即元素与周围元素之间的间距。margin-left 和 margin-right 分别控制左右两侧的外边距。
padding：用于设置元素内部的缩进，即内容与元素边框之间的间距。padding-left 和 padding-right 分别控制左右两侧的内边距。

通过这些属性，你可以灵活地控制页面中不同元素的缩进效果。

下一篇：css加下划线