CSS怎么限制文本字数

CSS怎么限制文本字数?

css限制字数,超出部分显示点点点的实现方法

使用css限制字数的显示,主要使用width宽度来设置,超出的部分显示点点点,主要通过设置text-overflow属性来实现。

下面小编举例讲解实现的过程。

新建一个html文件,命名为test.html,用于讲解怎么实现css限制字数,超出部分显示点点点。

543563fd3b69a846631f6f1d1ef838a.png

在test.html文件内,创建一个包含文字的div,并设置div的class属性为content,主要用于对div进行css样式设置。

97c08524a4589fed0728bf8a30f78de.png

在test.html文件内,对类名为content的div进行样式设置,代码如下:

a7bb4f53ef38f40d342a11463afddc0.png

在css内,设置div的宽度为130px,同时设置其浮动向左,居左对齐。

97d83f0354786b6d89b31adc142b633.png

在css内,设置div内的文字不换行,当文字超过宽度width时,隐藏文字。

31ccb98eca7656ce4c6fa3c3e58f241.png

在css内,设置div内文字超过宽度时,以点点点代替文字显示。

58167b3aab2dc57ef4147d730bfd41b.png

在浏览器打开test.html文件,查看实现的效果。

52f0599c95174d23119b09a11ed8077.png

更多css的相关知识,可访问:web前端自学!!

以上就是CSS怎么限制文本字数的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏