即使在屏幕調整大小的情況下如何完美鏈接中心鏈接？ HTML＆CSS

好吧，所以這裏有問題，我有一組鏈接（總共3個，名爲「新聞」，「關於」和「聯繫人」），我希望完全將這些內容居中，讓他們直接留在用戶的屏幕中心我的標誌下面這裏是我的代碼。即使在屏幕調整大小的情況下如何完美鏈接中心鏈接？ HTML＆CSS

HTML;

<!DOCTYPE html> 
<html> 
<head> 
<title>BHD - BlackHawk Drift</title> 
<!--Scripts--> 
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
<script src="scripts/fadein.js"></script> 
<script src="scripts/buttonfade.js"></script> 

<link rel="stylesheet" type="text/css" href="css/stylemain.css"> 
<!--end scrpts--> 
<!--setting the basic styles--> 
<style> 
a:link { 
color: #FAFAFA; 
} 
</style> 
</head> 

<body> 
<!--Providing the text--> 
<img class="displayed" src="img/text.png" alt="#blackhawk drift"> 
<!--end--> 

<!--basic mainpage links--> 
<div class="link"> 
<p1><a href="about.html" style="text-decoration:none">About</a></p1>&nbsp; 
<p1><a href="news.html" style="text-decoration:none">News</a></p1>&nbsp; 
<p1><a href="contact.html" style="text-decoration:none">Contact</a></p1>&nbsp; 
</div> 

</body> 
</html>

CSS;

html { 
background: url(../img/bg.jpg) no-repeat center center fixed; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
min-width: 400px; 
} 

IMG.displayed { 
display: block; 
margin-left: auto; 
margin-right: auto; 
margin-top: 23%; 
position: relative; 
} 

.link { 
display: block; 
padding: 2px; 
letter-spacing: 6px; 
position: relative; 
margin-left: auto; 
margin-right: auto; 
}

而且這裏有什麼，我試圖完成一個視覺形象.. 。

enter image description here