单行和多行文本溢出省略号显示！！！

单行文本溢出显示省略号

    <div class="p">
      《出师表》以恳切的言辞，针对当时的局势，反复劝勉刘禅要继承先主刘备的遗志，开张圣听，赏罚严明，亲贤远佞，以完成“兴复汉室”的大业，表现了诸葛亮“北定中原”的坚强意志和对蜀汉忠贞不二的品格。
    </div>
    
      .p {
        width: 200px;
        background: red;
        white-space: nowrap; /*文本强制不换行*/
        text-overflow: ellipsis; /*文本溢出显示省略号*/
        overflow: hidden; /*必须要结合盒子溢出*/
      }

多行文本溢出

    <div class="p">
      《出师表》以恳切的言辞，针对当时的局势，反复劝勉刘禅要继承先主刘备的遗志，开张圣听，赏罚严明，亲贤远佞，以完成“兴复汉室”的大业，表现了诸葛亮“北定中原”的坚强意志和对蜀汉忠贞不二的品格。
    </div>

      .p{
      width:200px;
      /*必须结合的属性，将对象作为弹性伸缩盒对象的子元素的排列仿古式*/
      display:-webkit-box;/*必须结合的属性，将元素设为弹性盒子模式(复古写法)*/
      -webkit-box-orient:vertical;/*必须结合的属性，设置弹性盒子对象的子元素，排列方式*/
      text-overflow:ellipsis;/*文本溢出显示省略号*/
      -webkit-line-clamp:3;/*例如超过2行显示省略号*/
      overflow:hidden; /*必须要结合盒子溢出*/
      }