Skip to content

Instantly share code, notes, and snippets.

@RobertWang

RobertWang/[css]纯CSS单行文本溢出追加省略号.md

Created May 9, 2014 03:02
Show Gist options
  • Save RobertWang/a4473671d11b71d33243 to your computer and use it in GitHub Desktop.
Save RobertWang/a4473671d11b71d33243 to your computer and use it in GitHub Desktop.
Download ZIP
[css]纯CSS单行文本溢出追加省略号
Raw
[css]纯CSS单行文本溢出追加省略号.md

之前一直以为单行文本溢出追加省略号没法兼容所有浏览器，经元泉同志提点，顺利解决：

示例

样式代码，四个属性都是必须的，并且宽度必须设在当前容器上，父容器定宽无效：

.box {
	width: 200px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

测试 IE6、IE7、IE8、IE9、Chrome、Firefox 均支持。 在线演示地址：text_overflow_ellipsis.html

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment