<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>多行文本顯示一行超出不分用……代替</title>
<style>
div{
width: 500px;
border: 1px solid black;
text-indent: 2em; /* 首行縮進2字 */
/* 下面三個必須搭配使用 */
overflow: hidden; /* 超出部分隐藏 */
white-space: nowrap; /* 多行文本在一行顯示 */
text-overflow: ellipsis; /* 溢出部分用“……”顯示 clip 溢出部分裁剪 */
}
samp{
color: red;
font-weight: bold;
font-style: italic;
font-size: 16px;
}
</style>
</head>
<body>
<div> <samp>多行文本顯示一行超出不分用……代替。</samp>夜晚，微風拂過面頰。那一絲絲的觸動讓我明白：春，要來了。清晨出門，陽光普照大地，清風和煦，花草樹木都來湊熱鬧，柳樹也不例外。她讓風幫她挽發，細長的發絲在風手中飄舞。沒過多久，雨點滴到了地上。啊！這是春雨！是春天生機的象征！這一場春雨來的真是時候，簡直是“好雨知時節，當春乃發生。”居然來的這麼準時且恰巧。一聲雷響，将世間萬物都驚醒。生機勃勃的春天就要回來了。我已經準備好迎接春了。</div>
</body>
</html>
![Docker - Dockerfile之ADD、COPY、WORKDIR、USER、EXPOSE指令詳解[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)