欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

使用css控制文字行数,多余的内容用省略号显示

程序员文章站 2022-04-22 14:02:24
...
  overflow: hidden;
  text-overflow: ellipsis; 
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;

这是当显示的行数超过1行时,可以使用这几行代码。-webbkit-line-clamp: 控制显示的行数,不要给当前标签设置height,让文字自动撑起高度。

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;

只要显示一行的时候可以使用以上这几行代码

   -webkit-border-radius:0px;
 -moz-border-radius:0px;
      border-radius:0px;
  -webkit-appearance:none;

当做手机端的时候,IOS系统总会给form表单的的输入框自动加上边框圆角的效果。上面这几行代码就是去掉IOS系统自带的边框圆角的效果的