<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>超出显示省略号</title>
    <style type="text/css">
   p{
    width:300px;
    border:1px solid #000;
    font:14px/30px "幼圆";
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;

   }


    </style>
</head>
<body>
<p>好好学习前端技术,每天学到新知识,好好学习前端技术,每天学到新知识</p>
</body>
</html>
    <style type="text/css">
   p{
    width:300px;
    border:1px solid #000;
    font:14px/30px "幼圆";
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;

   }


    </style>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.