HTML5中实现文本缩进有四种方式：一、用text-indent设置首行缩进；二、用pre标签保留空格实现精确缩进；三、用padding-left实现整段缩进；四、用writing-mode配合text-indent实现竖排缩进。
如果您希望在HTML5中实现文本缩进效果，可通过CSS的text-indent属性或pre标签原生保留空格特性来达成。以下是具体操作方式：
一、使用CSS text-indent属性设置首行缩进
text-indent属性专用于控制段落首行的缩进量，仅影响第一行文本的起始位置，不影响后续行。该方法适用于常规段落排版，语义清晰且易于维护。
1、在HTML中编写一个段落，例如： 这是一段需要首行缩进的文字内容。
2、在
立即学习“前端免费学习笔记（深入）”；
3、可将2em替换为其他单位值，如20px、1.5rem或5%，其中em单位基于当前字体大小，推荐优先使用
4、若需取消某段落缩进，可单独设置： 此段无缩进
二、使用pre标签配合空格或制表符实现精确缩进
pre标签会原样保留HTML源码中的空格、换行与制表符，适合展示代码块、诗歌或需多级缩进的固定格式文本。其渲染行为由浏览器默认的等宽字体和空白符处理机制决定。
1、在HTML中使用包裹目标文本，例如： 这是带中文全角空格缩进的行。
2、插入缩进时，可使用中文全角空格（U+3000）、英文半角空格（U+0020）或Tab字符（U+0009），全角空格在多数中文字体下视觉宽度更稳定
3、如需调整pre内字体或行高，可附加CSS：pre { font-family: "Microsoft YaHei", sans-serif; line-height: 1.6; }
4、注意pre标签默认有上下外边距和等宽字体，若需融入常规流式布局，应重置margin并指定font-family以匹配页面主字体
三、使用padding-left模拟段落整体缩进
当需要整段（而非仅首行）向右偏移时，padding-left可作用于块级容器，形成视觉上的“缩进”效果。该方式不改变文本流结构，适用于侧边留白、引用区块等场景。
1、为段落添加类名，例如： 整段内容均向右偏移20像素。
2、定义CSS规则：.indented-paragraph { padding-left: 20px; }
3、若缩进需响应式适配，可用媒体查询控制不同屏幕下的padding值，例如在小屏下设为padding-left: 10px
4、此方法会扩大元素总宽度，若父容器宽度固定，需配合box-sizing: border-box使用以避免溢出
四、使用CSS writing-mode配合text-indent实现竖排文本缩进
在中文古籍或特殊排版需求中，竖排文本首字下沉常需右侧缩进。writing-mode属性可切换文本流向，配合text-indent可精准控制竖排首行（即首列）的缩进方向。
1、设置容器为竖排布局：
2、添加CSS：.vertical-text { writing-mode: vertical-rl; text-indent: 1em; }
3、注意text-indent在vertical-rl模式下沿块轴（即自上而下方向）生效，此时1em对应的是当前字体大小的垂直距离，非水平宽度
4、若需兼容旧版浏览器，可添加前缀：-webkit-writing-mode: vertical-rl;及-ms-writing-mode: tb-rl;
