css多行文字超出部分省略号一行文字超出部分省略号

    .con{  position: relative }

       /* 多行文字超出宽度部分省略号 ：   */
        #div1{
            position: absolute;  width: 200px;
            overflow: hidden;
            -ms-text-overflow: ellipsis;text-overflow: ellipsis;
            display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
            -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
            -webkit-line-clamp: 3; /** 显示的行数 **/
            background: yellowgreen;
        }

    
    

        1 hello world!这是我内容的超出一行行省略号显示！ 2 hello world!这是我内容的超出一行行省略号显示！
    

        .con{  position: relative }

        /*一行文字超出宽度部分省略号 ： 强制不换行 隐藏多余的 文本多余显示省略号text-overflow:ellipsis */
        #div2{
            position: absolute;left: 0;top: 200px;
            width: 200px;   white-space:nowrap; overflow:hidden;  -ms-text-overflow: ellipsis;text-overflow: ellipsis;
            background: greenyellow;}