首页 > 作文

css之文本两端对齐的两种解决方法

更新时间:2023-04-03 17:01:11 阅读: 评论:0

说起文本对齐,大家都知道text-align,最常用的有left、right、center,今天我们说一下justify,也就是文本两端 对齐。说起来简单,但是有些小坑大家还是要注意的。

现在我们有这样的两行文本,实际开发中我们经常会遇到这样的情景:需要把姓名和电话号码这两段文字对齐。我们自然会想到 text-align: justify; 我也是这么想的,我们来试一下:

刷新一下浏览器,为什么没有效果呢?

原因是 justify 对最后一行无效,而我们的 nam圆形的周长公式e 只有一行,当然也就无效了。那我们怎么解决这个问题呢?

我们可以想到,既然justify对最后一行无效,那我们增加一行就好了,只要让它不是最后怎么修改默认浏览器一行不就ok了?当然我们增加的一行可不能被人看到。这里,我们想到了伪元素。

增加没有cpa一共几门几年考完文字的一行,我们来看看页面:

很不错,明显已经达到了要求。但是,这样写会不会太麻烦了呢,程序员都是讲究高效率(懒)的人,如果能用一句代码就完成的联想和想象的区别话,岂不乐哉?

别说,真有。这里安利一个新属性 text-align-last ,废话不多说,直接上代码:

stay here forever jewel

一句代码达到需求。

真好,真好。

本文发布于:2023-04-03 17:01:10,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/fanwen/zuowen/1dad0d509c5f5f9e9178c61bf596a390.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:css之文本两端对齐的两种解决方法.doc

本文 PDF 下载地址:css之文本两端对齐的两种解决方法.pdf

标签:一句   文本   真好   代码
相关文章
留言与评论(共有 0 条评论)
   
验证码:
Copyright ©2019-2022 Comsenz Inc.Powered by © 专利检索| 网站地图