在網頁設計中，經常需要使用到新開一個頁面的功能，這時候就可以使用“target”屬性來實現。而對于CSS中，也提供了方便的方式來使新頁面打開更加美觀，無需跳出當前網站的頁面。

我們可以通過CSS中的“:visited”來實現一個增強版的超鏈接，當用戶單擊連接并打開一個新頁面時，新頁面會平滑地偏移出來，就好像它是在當前頁面打開的一樣。當用戶返回到初始頁面時，他們將被迫滑的連續的兩個頁面之間的位置。雖然這個看起來是個小細節，但確實可以讓用戶體驗更加舒適。

/* 使用css中的“:visited”來增強超鏈接 */
a:visited {
color: blue;
text-decoration: underline;
}
/* 使新頁面打開的效果更加平滑 */
a[href]:after {
content: "↗";
margin-left: 0.2em;
}
/* 當新頁面返回到原始頁面時位置保持一致 */
@media (prefers-reduced-motion: no-preference) {
a[href]:after {
animation-duration: 0.5s;
animation-fill-mode: forwards;
animation-name: slideInFromRight;
animation-timing-function: ease-out;
display: inline-block;
transform: translateX(0.2em);
}
@keyframes slideInFromRight {
from {
transform: translateX(100%);
}
to {
transform: translateX(0.2em);
}
}
}

通過使用CSS中的這些技巧，我們可以使超鏈接在新頁面打開時更具有吸引力和舒適度。了解并實踐這些技巧可以使網頁設計更加出色。