css文本溢出样式

overflow:控制文本溢出。
auto:隐藏溢出内容,出现滚动条(方便查看里面的内容);
scroll:隐藏溢出内容,且出现滚动条;
hidden:隐藏溢出内容,不会出现滚动条,(对文本溢出不太友好);
visible:默认值,内容不会被隐藏,溢出内容会出现在元素的大小之外。

overflow:visble;正常/默认文本溢出样式

overflow:hidden;设置hidden隐藏溢出文本样式
在这里插入图片描述
overflow:auto;设置auto溢出文本上下滚动轴(正常情况下是没有左右滚动轴的)
在这里插入图片描述

overflow:scroll;设置scroll溢出文本上下、左右滚动轴
在这里插入图片描述

单独设置某个方向滚动条 (要配合overflow:hidden;使用)
overflow:hidden;设置文本溢出,溢出内容隐藏;
overflow-x:scroll;设置溢出文本左右滚动轴;

在这里插入图片描述

overflow-y:scroll;设置溢出文本上下滚动轴;
在这里插入图片描述

允许用户调整元素大小;
none:默认值,不能调整元素大小。
horizontal:可以调整元素的宽度。
vertical:可以调整元素的宽度。
both:可以调整元素的框高。
resize:both;
在这里插入图片描述
可以随意设置文本边框宽高
在这里插入图片描述
**resize:horizontal;**只能设置溢出文本边框的宽度
在这里插入图片描述

resize:vertical;
只能设置溢出文本边框的高度
在这里插入图片描述
隐藏溢出文本,以什么形式隐藏:
text-overflow: ellipsis;
ellipsis:隐藏溢出文本内容,以…为尾缀(不能以中文结尾);
在这里插入图片描述
中间不要有空格,中文结尾
自定义尾缀":隐藏溢出文本内容,以"自定义内容为尾缀,(仅对Firefox火狐浏览器有效)";

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值