博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
css text-align-last设置末尾文本对齐方式
阅读量:6167 次
发布时间:2019-06-21

本文共 867 字,大约阅读时间需要 2 分钟。

text-align-last:auto | start | end | left | right | center | justify

auto:

无特殊对齐方式。

left:

内容左对齐。

center:

内容居中对齐。

right:

内容右对齐。

justify:

内容两端对齐。

start:

内容对齐开始边界。

end:

内容对齐结束边界。

说明:用来设置一个块中的最后一行的对齐方式。只能运用于块元素上,或者说块元素的断行内。

这里着重讲解一下"justify",一般我们在写表单啥的情况下都会用到它。

默认情况下是这样的

857662-20160925125526794-522790081.png

用了"justify"以后

857662-20160925125740569-293118881.png

如果想让文字对齐可以把:去掉。

其实我们还可以这个样子。

857662-20160925130510820-24584426.png

原理就是用white-space保留空格。缺点就是你的自己调整空格哈,不过比起用 好多了。

"justify"还有一种地方也会用到,就像这个。

857662-20160925132048995-259266764.png

看起来右边特别丑,我们可以用text-align:justify

让我们一起共勉,互相支持,让我们跑得更快,跑得更好吧!哪怕路上有风雨,哪怕途中有坎坷,只要不放弃奔跑,不放弃对自我的修行,我们终究会创造属于自己的生命奇迹!

857662-20160925132223814-1035597820.png

要说text-aligntext-align-last的区别可能就是text-align-last只包含最后一行。

有时候我们还真的想让最后一行文本居中。

857662-20160925132549938-1624225318.png

这种情况我想也是会有的吧,代码如下:

让我们一起共勉,互相支持,让我们跑得更快,跑得更好吧!哪怕路上有风雨,哪怕途中有坎坷,只要不放弃奔跑,不放弃对自我的修行,我们终究会创造属于自己的生命奇迹!

注意:如果text-alignlast-align-last同时设置,那么会忽然text-align对最后一行的设置。

转载地址:http://lpuba.baihongyu.com/

你可能感兴趣的文章
centos64i386下apache 403没有权限访问。
查看>>
jquery用法大全
查看>>
PC-BSD 9.2 发布,基于 FreeBSD 9.2
查看>>
css斜线
查看>>
Windows phone 8 学习笔记(3) 通信
查看>>
Revit API找到风管穿过的墙(当前文档和链接文档)
查看>>
Scroll Depth – 衡量页面滚动的 Google 分析插件
查看>>
Windows 8.1 应用再出发 - 视图状态的更新
查看>>
自己制作交叉编译工具链
查看>>
Qt Style Sheet实践(四):行文本编辑框QLineEdit及自动补全
查看>>
[物理学与PDEs]第3章习题1 只有一个非零分量的磁场
查看>>
onInterceptTouchEvent和onTouchEvent调用时序
查看>>
android防止内存溢出浅析
查看>>
4.3.3版本之引擎bug
查看>>
SQL Server表分区详解
查看>>
STM32启动过程--启动文件--分析
查看>>
垂死挣扎还是涅槃重生 -- Delphi XE5 公布会归来感想
查看>>
淘宝的几个架构图
查看>>
linux后台运行程序
查看>>
Oracle中drop user和drop user cascade的区别
查看>>