css line-height属性是什么

line-height用于设置文本行间距，影响可读性与布局；推荐使用无单位数值（如1.5），具有良好继承性；常用于段落排版、按钮文字垂直居中；需避免过小值导致文字重叠。

line-height 是 CSS 中用于控制文本行与行之间垂直间距的属性。它决定了文字行框（line box）的高度，直接影响段落或多行文本的可读性和视觉效果。

基本作用

line-height 设置的是每行文字所占的最小高度，浏览器会根据这个值来决定行与行之间的空白距离。这个属性对英文换行、中文排版、按钮内文字垂直居中等场景都很关键。

常见取值方式：

• 无单位数值（如 1.5）：表示当前字体大小的倍数，推荐使用，具有良好的继承性
• 带单位的长度（如 20px、1.5em）：固定行高，可能在嵌套元素中引发布局问题
• 百分比（如 150%）：相对于当前元素的字体大小计算
• auto：浏览器默认行为，通常由用户代理决定

实际应用示例

设置段落行高提升阅读体验：

p {
  font-size: 16px;
  line-height: 1.6; /* 推荐做法 */
}

此时每行高度为 16px × 1.6 = 25.6px，上下留白均匀分布，文字不会显得拥挤。

与 vertical-align 的关系

在 inline 或 inline-block 元素中，line-height 还会影响元素在行内的垂直对齐。比如让图标和文字垂直居中对齐时，调整 line-height 常常比用 padding 更有效。

例如按钮中文本居中：

button {
  height: 40px;
  line-height: 40px; /* 文字垂直居中 */
  text-align: center;
}

注意事项

• 使用无单位数值更利于响应式设计和字体缩放
• 过小的 line-height 会让文字重叠，影响可读性
• 父元素设置 line-height 会被子元素继承，需注意嵌套文本的表现

基本上就这些，合理设置 line-height 能显著提升网页文本的美观度和易读性。

# css  # 浏览器  # 响应式设计  # 垂直居中  # auto  # 继承  # padding  # 推荐使用  # 具有良好  # 行之  # 的是  # 行间  # 还会  # 能在  # 英文  # 都很  # 会让 

相关栏目： 【 Google疑问12 】 【 Facebook疑问10 】 【 网络优化76771 】 【 技术知识130152 】 【 IDC云计算60162 】 【 营销推广131313 】 【 AI优化88182 】 【 百度推广37138 】 【 网站推荐60173 】 【 精选阅读31334 】

相关推荐： php打包exe后无法写入文件_权限问题解决方法【教程】  Win11如何设置环境变量 Win11添加和修改系统与用户变量【教程】  PhpStorm怎么调试PHP代码_PhpStorm断点设置与调试启动步骤【指南】  Win11怎么关闭自动调节屏幕亮度_Windows11禁用内容自适应亮度控制  如何在 Go 同包不同文件中正确引用结构体  Windows10无法连接到Internet_Win10网络重置命令详解  Win11怎么设置组合键快捷方式_Windows11自定义快捷键操作  Win11怎么关闭通知中心_Windows11系统通知与专注助手设置  Win11怎样激活系统密钥_Win11系统密钥激活步骤【攻略】  Windows10系统怎么查看防火墙状态_Win10安全中心网络保护  如何在 Windows 11 中使用 AlomWare 工具箱  Windows电脑键盘突然失灵怎么办？（驱动与硬件排查）  c++中的Tag Dispatching是什么_c++利用标签分发优化函数重载【元编程】  Win11怎么关闭OneDrive同步_Win11取消自动备份文件【教程】  c# 在ASP.NET Core中管理和取消后台任务  如何使用Golang优化模块引入路径_Golanggo mod tidy清理与优化方法  如何使用Golang开发简单的聊天室消息存储_Golang WebSocket数据持久化方法  Python音视频处理高级项目教程_FFmpegPydub剪辑与特效  Win11怎么设置默认视频播放器_Windows 11关联媒体文件打开方式【步骤】  Windows音频驱动无声音原因解析_声卡驱动错误修复步骤  如何使用Golang安装依赖库_管理模块和第三方包  Win11怎么设置按流量计费_Win11限制后台流量消耗【网络】  c++ stringstream用法详解_c++字符串与数字转换利器  Python大型项目拆分策略_模块化解析【教程】  Win10如何卸载Skype_Win10卸载Skype步骤【步骤】  php中作用域操作符能访问私有静态属性吗_访问权限限制【指南】  Python文件管理规范_工程实践说明【指导】  Mac电脑进水了怎么办_MacBook进水后紧急处理方法【必看】  Win11怎么格式化U盘_Win11系统U盘格式化与文件系统选择【教程】  如何使用正则表达式提取以编号开头、后跟多个注解的完整代码块  c++怎么操作redis数据库_c++ hiredis库连接与命令执行【实战】  Win11怎么恢复误删照片_Win11数据恢复工具使用【推荐】  如何减少Golang内存碎片化_Golang内存分配与回收优化方法  MySQL 中使用 IF 和 CASE 实现查询字段的条件映射  Windows10如何删除恢复分区_Win10 Diskpart命令强制删除分区  Win11应用商店下载慢怎么办 Win11更改DNS提速下载【修复】  VSC怎么创建PHP项目_从零开始搭建项目的步骤【操作】  mac本地php环境如何开启curl_curl扩展启用与测试步骤详解【汇总】  Win11任务栏怎么调到左边_Win11开始菜单居左设置教程【步骤】  Windows10如何更改桌面背景_Win10个性化幻灯片放映设置  Win11怎么开启游戏工具栏_Windows11 Xbox Game Bar快捷键  C++ static_cast和dynamic_cast区别_C++静态转换与动态类型安全转换  C++如何使用std::async进行异步编程？（future用法）  Win10怎么更改用户名 Win10修改账户名称操作教程  Win11怎么关闭系统声音_Win11系统提示音静音设置【详解】  Win10系统字体模糊怎么办_Windows10高级缩放设置修复  php下载安装包太大怎么下载_分卷压缩下载方法【教程】  如何在Golang中理解指针比较_Golang地址比较与相等判断  如何在Golang中捕获JSON序列化错误_Golangjson.Marshal错误处理示例  Windows10系统怎么查看显卡驱动_Win10设备管理器驱动更新 

 2025-12-05