經過多年發展，CSS已經成為Web開發中的必備基礎技能之一。雖然它看起來很簡單，但是實現某些特定的功能仍然挑戰性很強。以下是CSS實現3點難易程度不同的功能：

1.垂直居中

.container{
display: flex;
justify-content: center;
align-items: center;
}

很容易看出，僅需要兩行CSS代碼就可以實現垂直居中。display: flex將其子元素變成了彈性盒子，justify-content和align-items屬性使子元素在容器中水平和垂直居中。這在實現響應式設計中很常見，也是相對容易掌握的技巧。

2.彈出層

.modal{
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 9999;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0,0,0,0.5);
}

彈出層在實現時需要考慮到許多因素，如居中，遮罩層等。這實際上是一種position:fixed布局。這個布局具有堅實的基礎和需要掌握的CSS技能，例如z-index和flexbox。這是可控性和分類的關鍵。

3.圖片自適應

.img{
display: block;
max-width: 100%;
height: auto;
}

自適應是Web開發中的基本要求之一，尤其是在響應式設計中。 CSS是一種讓圖片自適應的強大工具，可以通過設置max-width和height:auto來實現。這可以讓圖片根據其容器的大小自動調整大小，而不會拉伸或變形。