css常见问题

取消表单轮廓和防止拖拽文本域问题

1、取消表单轮廓
outline：none
2、防止拖拽文本域
resize：none

图片底部留白空隙问题

解决方法有两种：

• 给图片添加vertical-align：middle、top、bottom
  因为图片默认是与文字基线对齐
• 将图片转换成块级元素 display：block
  因为只有行内块元素才有vertical-align

单行文字溢出省略号显示问题

1、强制文字在一行内显示

 white-space：nowrap；

2、将文字溢出部分隐藏

  overflow：hidden；

3、文字溢出部分用省略号显示

  text-overflow：ellipsis；

多行文字溢出省略号显示问题

多行文本溢出显示省略号，有较大的兼容性，适合于webkit浏览器或移动端（移动端大多为webkit内核）

overflow:hidden;
text-overflow:ellipsis;
/*限制盒子模型显示*/
display：-webkit-box；
/*限制在一个块元素显示的文本的行数*/
-webkit-line-clamp：2；
/*设置或检索伸缩盒子对象的子元素排列方式*/
-webkit-box-orient：vertical；