css 单行显示 text 适应browser size

.text {
    white-space:nowrap;  /*文本不换行*/
    overflow: hidden; /*超出文本隐藏*/
    text-overflow:ellipsis; /*超出文本替换 clip不显示 ellipsis省略号 指定string"..."->chrome不支持*/ 
}
<!DOCTYPE html>
<html>
<head>
     <meta charset="utf-8"> 
    <title>css 单行显示 text  适应browser size</title>
    <link rel="stylesheet" type="text/css" href="../css/style.css">
</head>
<body>
    <div class="text">12345678 12345678 12345678</div>
    <p class="text">一二三四五六七八 一二三四五六七八</p>
</body>
</html>

效果图

css 单行显示 text 适应browser size

你可能感兴趣的:(css,overflow,white-space,text-overflow)