共计 2135 个字符，预计需要花费 6 分钟才能阅读完成。
大家好，我是半夏👴，一个刚刚开始写文的沙雕程序员. 如果喜爱我的文章，能够关注➕ 点赞 👍 加我微信：frontendpicker，一起学习交换前端，成为更优良的工程师～关注公众号： 搞前端的半夏 , 理解更多前端常识! 点我摸索新世界！
原文链接 ==>http://sylblog.xin/archives/36
前言
在深度分析 text-align 家族和你不晓得的下划线 -text-decoration 两篇介绍文本属性的时候，咱们根本曾经学会了很多之前没有应用过的属性，明天咱们接着来看更多的文本属性，CSS 的世界是精妙的，无尽的，仅仅心愿同这三篇文章，能够入得 CSS 文本属性的根底门。人生短暂，学无止尽。
text-justify
兼容性
此属性目前被列为“有危险”在候选举荐期间被抛弃。因而，不倡议在生产中应用此属性，因为它不太可能在不久的未来成为所有浏览器的规范。
兼容性很差，目前也就火狐浏览器能够用！！！仅学习。
定义
规定 text-align: justify; 应用的对齐形式。
text-justify 必须与 text-align: justify; 同时呈现，如果你还不晓得 text-align: justify; 是啥，请立刻浏览学透 CSS- 深度分析 text-align 家族 文本属性（上）（连载中），看完再来看这篇文章。
属性值
auto
默认值 ，容许浏览器确定对齐形式是否更好地解决为 inter-word 或 inter-character。这在内容语言在出现之前未知的多语言场景中很有帮忙。
inter-word
通过调整单词间距来指定文本对齐
inter-character
通过调整字符间距指定文本对齐
可能单纯的看 inter-word 和 inter-character 的截图不是太分明，放一张比照图。
第一张：inter-character
第二张：inter-word
认真看最显著的两处：
就不容易了 A
Your worst battle is
第一张图 your 的字符间距是比拟大的，第二章 Your worst 两头的间距比拟大
none
禁用对齐办法。打消父元素带来的 inter-word 和 inter-character 属性
distribute
已被破除，不提倡应用
亲测在火狐浏览器体现如下
text-orientation
兼容性
浏览器的兼容还是不错的，除了 IE（永远的噩梦）
定义
在文字的书写模式为竖直的状况下，扭转字符的方向。
竖直模式 writing-mode
- writing-mode: vertical-lr;
- writing-mode: vertical-rl;
属性值：
mixed
默认值。程度脚本中的字符顺时针旋转 90°。
认真看截图中的英文和数字，方向是被旋转 90°.
upright
此值会将字符自身从旋转 90°旋转到其天然地位。留神这个关键字会导致所有字符被视为从左到右，也就是 direction 被强制设为 ltr(从左往右)。
sideways
垂直书写模式下的所有文本都横向显示，就像在程度布局中一样，整行顺时针旋转 90°。。
sideways-right：
某些浏览器将此值视为 sideways 为向后兼容而保留的值的别名。
text-combine-upright
首先我感觉这个属性就是对 text-orientation 的一个补充，次要的作用就是想把某些字符放在一行显示，例如 下面的截图频繁呈现的 13，在竖直模式下，是分两行显示的。为了让他们在一行显示就须要用到这个属性了。
兼容性
火狐和谷歌兼容还是不错的，能够用。
属性值
all
垂直蕴含框中所有间断的排版字符在同一行程度显示，占用垂直框中单个字符的空间。
请仔细阅读这句话！！！
all 例子 1
writing-mode: vertical-lr;
text-combine-upright: all;
<p>
我说道：“爸爸，你走吧。”他往车外看了看，说：“我买几个橘子去。你就在此地，不要走动。”我看那边月台的栅栏外有几个卖东西的等着顾客。走到那边月台，须穿过铁道，须跳下去又爬上去。父亲是一个瘦子，走过来天然要麻烦些。我原本要去的，他不肯，只好让他去。我看见他戴着黑布小帽，衣着黑布大马褂 12，深青布棉袍，蹒跚 13 地走到铁道边，缓缓探身上来，尚不大难。可是他穿过铁道，要爬上那边月台，就不容易了。</p>最终的成果：
是不是霎时明确了，让你仔细阅读的起因啦！！！
all 例子 2
p{writing-mode: vertical-lr;}
span{text-combine-upright: all;}
<p>
我说道：“爸爸，你走吧。”他往车外看了看，说：“我买几个橘子去。你就 在此地，不要走动。”<span id="leftSpan" >202108</span> 就不容易了。</p>最终的成果
这下是不是晓得怎么应用了，浏览器并不会辨认那些要显示在一行，须要咱们指定哪些字符显示在一行。
digits \<integer\>
兼容性
对于这个属性，顺便放出了兼容性图。从图中看，这个属性根本没法应用
垂直蕴含框中所有间断的 ASCII 数字在同一行上程度显示，占用垂直框中单个字符的空间，最多为指定的整数。如果没有指定整数，则默认值为 2 位。任何低于 2 和高于 4 的都是有效的。
语法
text-combine-upright: digits 2;
