如何使用css实现文字一行居中，多行左对齐？_html/css_WEB-ITnose

WBOY

Freigeben： 2016-06-21 09:03:50

Original

1690 Leute haben es durchsucht

我记得多年前在蓝色理想有位高手解决了这个问题的。但是时隔多年，利用搜索引擎也没搜索出来。因此特此提问。

想要实现的效果为：

未知文字长度，当文字长度小于盒子宽度，也就是一行时，文字居中。
当文字长度大于盒子的宽度，会自动换行，成为多行文字，此时文字左对齐。

下图为示例：

希望能有纯css的解决方案，为了这个写一段js很不划算。虽然用js来解决是一件巨简单的事情。

回复讨论(解决方案)

width: 200px;max-width:200px;*width:expression(this.scrollWidth > 200 ? '200px' : 'auto')
超过自动换行。

width: 200px;max-width:200px;*width:expression(this.scrollWidth > 200 ? '200px' : 'auto')
超过自动换行。

没有理解问题。但是谢谢你的答案。

解决方法：http://blog.csdn.net/FungLeo/article/details/49797311 （2015年11月12日 13:03:39 此时还在审核）

Verwandte Etiketten：

如何使用css实现文字一行居中，多行左对齐？

Quelle：php.cn

Vorheriger Artikel：如何变换颜色_html/css_WEB-ITnose Nächster Artikel：web移动端开发，图片平铺问题_html/css_WEB-ITnose

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Neueste Artikel des Autors