文字超出显示三个点，HTML/Vue代码在线实时编辑、预览

HTML

格式化

支持Emmet，输入 p 后按 Tab键试试吧！

<head> ...

展开

</head>

<body>

            
                1
2
3
4
5
6
7

            
            <input class="input_text" type="text" 
  value="这是一段很长很长的文字超出部分显示三个点"  
/>

<div class="input_text">
  这是一段很长很长的文字超出部分显示三个点
</div>

</body>

CSS

格式化

            
                1
2
3
4
5
6
7
8
9

            
            .input_text {
    width: 100px;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:1;/* 超出多少行才显示三个点，1:表示超出1行就显示 */
}

格式化

预览

控制台