溢出的文字隐藏

word-break:自动换行
      • normal:使用浏览器默认的换行规则。
      • break-all:允许在单词内换行。
      • keep-all:只能在半角空格或连字符处换行。
强制一行显示文本 white-space:  nowrap
         强制在同一行内显示所有文本,直到文本结束或者遭遇br标签对象才换行。
文字溢出   text-overflow : clip | ellipsis 
  • clip : 当对象内文本溢出时简单的裁切
  • ellipsis : 当对象内文本溢出时显示省略标记(...)
  • 注意一定要首先强制一行内显示,再次和overflow属性搭配使用
    • 多余的部分显示省略号
  • white-space:nowrap   强制在同一行内显示所有文本
    •  overflow:hidden  多余的内容隐藏掉
    • text-overflow: ellipsis;  溢出的部分显示省略号
    •  注意:三个属性同时使用才有效果
posted @ 2020-08-16 22:11  帅气巴巴  阅读(117)  评论(0编辑  收藏  举报