在Web開發中，我們經常需要設置頁面元素的字體和上邊框。幸好，CSS提供了非常便利的方法來實現這些效果。

首先，我們可以使用CSS的font-family屬性來設置頁面元素的字體。例如，我們可以將網站的標題設置為Open Sans字體：

h1 {
font-family: 'Open Sans', sans-serif;
}

上述代碼將使所有的H1標題都采用Open Sans字體，如果該字體不可用，則使用系統默認字體。

除了設置字體，我們也可以用CSS的border-top屬性來為頁面元素添加上邊框。例如，在下面的例子中，我們為div元素添加了粗細為2像素的紅色上邊框：

div {
border-top: 2px solid red;
}

上述代碼將為所有的div元素添加紅色的上邊框，可以根據實際需要進行調整。

最后，我們可以將上述兩種效果結合起來，實現同時設置字體和上邊框的效果。例如，在下面的例子中，我們將h2標題設置為Roboto字體，同時為其添加紫色的上邊框：

h2 {
font-family: 'Roboto', sans-serif;
border-top: 2px solid purple;
}

上述代碼將為所有的H2標題采用Roboto字體，并為其添加紫色的上邊框，為頁面增加更好的視覺效果。