美文网首页
文本对齐 text-align text-justify

文本对齐 text-align text-justify

作者: zxqian1991 | 来源:发表于2017-02-13 10:23 被阅读124次

在开发的过程中,有时需要保存整个的单词,但是,尴尬的是,单词的大小总不是一致的,这就会导致,某个比较长的单词窜到了下一行,而上一行就会留下很大的空白,这个时候该怎么办?

这个时候其实可以通过下面的方式来实现:

.someclass {
    text-align:justify;
    text-justify:inter-word;
}

text-align

一般来讲,我们常用的text-align的值只有三类: centerleftright,但是,text-align可以取以下几个值:

取值 说明
left 对左靠齐
right 对右靠齐
center 居中
justify 自适应,实现两端对齐文本效果。
inherit 继承父元素text-align效果

text-justify

取值 说明
auto 浏览器决定齐行算法。
none 禁用对齐
inter-word 增加/减少单词间的间隔。
inter-ideograph 用表意文本来排齐内容
inter-cluster 只对不包含内部单词间隔的内容(比如亚洲语系)进行排齐。
distribute 类似报纸版面,除了在东亚语系中最后一行是不齐行的。
kashida 通过拉伸字符来排齐内容。

相关文章

  • 文本对齐 text-align text-justify

    在开发的过程中,有时需要保存整个的单词,但是,尴尬的是,单词的大小总不是一致的,这就会导致,某个比较长的单词窜到了...

  • text-justify两端对齐

    参考网址:菜鸟教程 text-justify:此属性指定应怎样对齐文本以及对齐间距。

  • 文本

    文本 text text-align: 文本对齐方式left 左对齐center ...

  • bootstrap常用类

    一.文本1)对齐方式text-left 文本左对齐 =======> text-align:...

  • 水平对齐

    1 水平对齐 文本对齐 text-align h1 { text-align: center } 运行效果: 1-...

  • HTML与CSS的文本

    文本 color text-align ​ 设置文本对齐方式,center(居中),left(左对齐),rig...

  • CSS入门2(0719)

    07-19 1.文本设置