在網頁設計中，文本對齊是非常重要的一個因素。而在文本對齊中，頂部對齊也是比較常用的一種方式。CSS實現文本對齊頂部對齊是非常簡單的，下面我們來具體了解一下。

p {
display: flex;
align-items: flex-start;
}

以上代碼使用了CSS的Flexbox布局，將p元素設為彈性盒子，同時將其內部元素垂直對齊方式設置為頂部對齊。

需要注意的是，使用文本對齊頂部對齊時，要考慮到不同字體的高度差異帶來的影響。如果有需要，可以使用line-height屬性來調整行高，使得文本看起來更為整齊美觀。

除了使用Flexbox布局，還可以使用CSS的表格布局。示例如下：

p {
display: table;
}
span {
display: table-cell;
vertical-align: top;
}

以上代碼使用了CSS的表格布局，將p元素設為表格元素，同時將其內部元素設置為表格單元格，并通過vertical-align屬性將其垂直對齊方式設置為頂部對齊。

總之，通過CSS文本對齊頂部對齊的方式有很多種，不同的情況下適用的方式也有所不同。希望本文能幫助你更好地掌握CSS的文本對齊技巧。