CSS3中的動畫特效讓網頁設計更加生動，其中從下往上展開動畫效果為一種常用效果。在實現該動畫效果時，主要利用CSS3的transition和transform屬性。

/*CSS代碼*/
.box {
width: 200px;
height: 0;
overflow: hidden;
background-color: #2196F3;
transition: height 0.5s ease-in-out;
transform-origin: top;
}
.box:hover {
height: 200px;
}

上述代碼中，首先設置容器.box的高度為0，overflow為hidden，使其內容不可見。同時設置該容器的背景色為#2196F3，即深藍色。接下來利用transition屬性設置容器高度從0到200px的過渡效果，時長為0.5s，緩動函數為ease-in-out。

另外，利用transform-origin屬性指定動畫變形的基點位置，本例中指定為頂部。

當鼠標懸停在容器上時，觸發:hover偽類事件，使.box的高度從0過渡到200px，實現從下往上展開的效果。

需要注意的是，容器高度的設定應根據內容的實際高度進行設置，否則會出現高度設置過小或過大的情況。