CSS中可以通過overflow屬性來設置元素的內容區域溢出時的處理方式,其中溢出隱藏是一個常用的處理方式。
/* 將含有過多內容的元素內容溢出時隱藏 */ .example { overflow: hidden; }
上面的代碼表示將class為example的元素的內容溢出時自動隱藏。需要注意的是,溢出隱藏只影響超出元素尺寸的部分,不會影響元素本身的顯示位置和尺寸,如果需要改變元素的尺寸,可以使用width和height等屬性。
另外,當元素的內容區域比元素本身尺寸小且設置了溢出隱藏時,元素內部仍然可能存在可滾動區域。可以通過overflow-x和overflow-y來分別控制橫向和縱向的滾動條。
/* 將元素的y軸方向溢出時隱藏并添加縱向滾動條 */ .example { overflow-y: scroll; }
上面的代碼表示將class為example的元素在y軸方向溢出時自動隱藏,并且添加縱向滾動條。