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

不再有排版孤行和寡行

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

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

复制代码
.title {
 
    text-wrap: balance;
}
相关推荐
勇气要爆发几秒前
问:LocalStorage、Vuex、Pinia的区别和本质
前端
Aerelin1 分钟前
iframe讲解(爬虫playwright的特殊应用)
前端·爬虫·python·html
Drift_Dream5 分钟前
IntersectionObserver:现代Web开发的交叉观察者
前端
9***P33417 分钟前
前端错误监控工具
前端
东东23337 分钟前
GeoJSON 介绍:Web 地图数据的通用语言
前端·javascript·json
之恒君37 分钟前
Promise.resolve(x) 等同 new Promise(resolve => resolve(x))?
前端·promise
亮子AI39 分钟前
【Javascript】jsondiffpatch检测到子节点改变了,父节点会标记为改变吗?
开发语言·前端·javascript
什么时候星期五41 分钟前
antd 4.x Tabs 点击阻止冒泡
css·react.js
T___T1 小时前
写着写着,就踩进了 JavaScript 的小坑
前端·javascript·面试
月亮慢慢圆1 小时前
首字母模糊匹配
前端