html怎么限制标题字数,CSS怎么限制文本字数

e0a7937f43a0a9b156ec06a920c5671c.png

CSS怎么限制文本字数?

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

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

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

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

5a6a4a94d82a26c12ddf597cb5f06013.png

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

2ed5e194b360016f0df9e317b2a7e0da.png

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

7d2b1b54968115d37e7d1a83fc7db2a7.png

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

1ea9c53e832fb8e0d380748029b69b6d.png

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

dacbc88b0dc36d9269eddfb330d5a011.png

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

12e4a3f351f097dd8d04fd9084917be2.png

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

2e70401a792568bd0d2f13f63fe46879.png

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

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值