CSS3可以用來實現頂部對齊效果，這在網頁布局中非常常見。下面我們來介紹一些方法。 首先是使用Flexbox布局。在容器上設置display:flex，然后在子元素上設置align-self:flex-start即可實現頂部對齊效果。

.container{
display:flex;
}
.item{
align-self:flex-start;
}

其次是使用CSS Grid布局。在容器上設置display:grid，然后使用grid-template-rows屬性設置行高，再在子元素上使用align-self:start實現頂部對齊效果。

.container{
display:grid;
grid-template-rows: auto 1fr;
}
.item{
align-self:start;
}

還有一種方法是使用vertical-align屬性。在子元素上設置display:inline-block，然后設置vertical-align:top即可實現頂部對齊效果。

.item{
display:inline-block;
vertical-align:top;
}

最后需要注意的是，以上方法在實現前提是父級元素的高度必須是確定的或者可以被設置為100%。如果父級元素是不確定高度的，可以使用一些其他的技巧來實現頂部對齊效果，比如使用js或者偽元素等等。