CSS实现文本自动平衡text-wrap: balance

不再有排版孤行和寡行

我们都知道那些标题,最后一个单词换行并单独站在新行上,破坏了视觉效果,看起来很奇怪。当然,有老式的 手动换行或将内容分成不同部分。但您听说过text-wrap: balance吗?

通过应用text-wrap: balance属性,浏览器将自动计算单词数并将它们平均分配到两行------非常适合页面标题、卡片标题、工具提示、模态框和FAQ等。

复制代码
.title {
 
    text-wrap: balance;
}
相关推荐
我是哈哈hh5 分钟前
【AJAX项目】黑马头条——数据管理平台
前端·javascript·ajax·前端框架·axios·proxy模式
高端章鱼哥7 分钟前
分享一个 MySQL binlog 分析小工具
前端
Ronin-Lotus9 分钟前
上位机知识篇---AJAX
前端·javascript·ajax
Rika13 分钟前
手写mini-vue之后,我写了一份面试通关手册
前端·vue.js
Sherry00713 分钟前
CSS Grid 交互式指南(译)(下)
css·面试
我想说一句14 分钟前
使用React开发拉布布旅游智能聊天机器人的实践
前端·前端框架
wwy_frontend14 分钟前
积累:04-VUE2
前端
拾光拾趣录14 分钟前
箭头函数 vs 普通函数:从“this 指向混乱”到写出真正健壮的代码
前端·javascript
一只毛驴16 分钟前
浏览器中的事件冒泡,事件捕获,事件委托
前端·面试
lixin20 分钟前
使用 MCP 协议扩展 Cursor 功能:原理解析与实战指南
前端