在寫一個前端頁面的時候,由於分辨率不同的兩個屏幕展示,導致換行問題。以下爲解決代碼,將字顯示在一行:
.text-size {
display: block; //內聯元素加
width: 210px;
height: 12px;
font-size: 10px;
line-height: 12px;
word-break: keep-all; // 不換行
white-space: nowrap; // 不換行
overflow: hidden; // 內容超出寬度部分隱藏部分的內容
text-overflow: ellipsis; // 超出部分用點點顯示
cursor: pointer; //鼠標移上去顯示手
position: relative;
transition: opacity 1s ease-in-out;
// 鼠標移上去背景高亮
&:hover {
background-color: #ceeff5;
}