p标签div文本超出部分显示省略号...

  • 单行文本溢出显示省略号
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
  • 多行文本显示省略号
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;   行数
overflow: hidden;
  • 补充一点点:单行文本分散对齐(两端对齐)
    • 方法一
.box{
  display: inline-block;
  width: 100px;
  text-align: justify;
  text-align-last: justify;
  text-justify:distribute-all-lines;  // 兼容ie
}

  • 方法二
    span{
      display: inline-block;
      width: 100px;
      text-align: justify;
      vertical-align: top;
    }
    span::after{
      display: inline-block;
      width: 100%;
      content: '';
      height: 0;
    }

使绝对定位内部元素不继承父级宽度,而是靠内容自动撑开宽度

在需要宽度自动撑开的元素上面添加样式:

white-space:nowrap

你可能感兴趣的:(p标签div文本超出部分显示省略号...)