CSS實現左邊溢出隱藏可以通過overflow:hidden;屬性來實現。這個屬性可以讓超出容器范圍的內容隱藏起來,不顯示出來。
.container{ width:200px; height:200px; border:1px solid #ccc; overflow:hidden; } .content{ width:400px; height:400px; background-color:#ddd; margin-left:-100px;/*超出容器范圍*/ }
在上面的代碼中,我們首先定義了一個容器,即class為.container的div,寬高分別為200px,邊框為1px實線的灰色。為這個容器設置了溢出隱藏的屬性。
在容器中,我們又創建了一個class為.content的div,寬高分別為400px,背景為灰色。并且將其向左偏移了100px,即超出了容器的范圍。
此時,我們可以看到內容超出容器范圍的部分被隱藏了起來,不會對布局造成影響。