CSS（層疊樣式表）是在 HTML 文件中控制樣式和布局的一種語言。雖然 CSS 的學習曲線相對 HTML 來說稍微陡峭一些，但是通過一些實用的 CSS 知識，可以讓我們創(chuàng)造出更吸引人的網(wǎng)頁。

隨著互聯(lián)網(wǎng)技術的不斷發(fā)展，越來越多的程序員和設計師在社交媒體平臺、技術博客上以視頻的形式來分享 CSS 的寫法技巧，讓學習 CSS 變得容易又有趣。

.box {
position: relative; 
width: 200px; 
height: 200px; 
background: #336699;  
overflow: hidden; 
}
.box:hover .mask {
opacity: 1; 
transition: all 0.3s ease-in-out;
}
.mask {
position: absolute;
top: 0; 
left: 0;  
width: 100%; 
height: 100%; 
background-color: rgba(0,0,0,0.7); 
display: flex; 
align-items: center; 
justify-content: center; 
opacity: 0; 
}
.mask p {
color: #fff; 
font-size: 24px; 
font-weight: bold;
}

上述代碼是一個簡單的 CSS 示例，用于在鼠標懸浮時顯示一個背景色不同的遮罩層。該代碼使用了 position 屬性、overflow 屬性、opacity 屬性、rgba 顏色選取方式、flexbox 進行居中等多種 CSS 知識點，雖然代碼看起來有些復雜，但操作起來其實非常靈活。

在觀看 CSS 的寫法視頻時，記得要注重理解思想，而不僅僅是復制粘貼代碼。因為只有理解了 CSS 的本質(zhì)原理，才能更好地運用 CSS 操作網(wǎng)頁布局和樣式，讓我們的網(wǎng)頁效果更加出眾。