當我試圖把我的旗幟作爲圖像，它不正確顯示？

我正在爲我的高中機器人團隊製作一個網站。我試圖讓我的旗幟成爲一個鏈接，但出於某種原因，圖片背後有一個我無法擺脫的小盒子。我試着看看其他線程，這告訴我我需要爲代碼設置一個寬度，但沒有工作。我也讀過，我需要設置一個邊界屬性爲「0」，這是行不通的。我想不明白。當我試圖把我的旗幟作爲圖像，它不正確顯示？

<!DOCTYPE> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="index_style.css"> 
<link href='http://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'> 
<title>Team 3774 Homepage</title> 
</head> 
<body> 

<div id="page"> 
<div class="Banner"> 
<a class="Banner_Link" href="www.robotichive3774.com"> 
<img src="/Images/Banner.png" height="200" width="1350" border="0"> 
</a> 
</div> 

<div class="navbar"> 
<ul class="nav"> 
    <li><a class="li_nav" href="/Home">Home</a></li> 
    <li><a class="li_nav" href="/Team Bio">Team Bio</a></li> 
    <li><a class="li_nav" href="/Our Robot">Our Robot</a></li> 
    <li><a class="li_nav" href="/Our Coach">Our Coach</a></li> 
    <li><a class="li_nav" href="/Gallery">Gallery</a></li> 
    <li><a class="li_nav" href="/Outreach">Outreach</a></li> 
    <li><a class="li_nav" href="/Youtube">Youtube</a></li> 
</ul> 
</div> 
</div> 

<div class="body"> 
<h1 class="main_header">Welcome to Robotics Team 3774!</h1> 
<div class="main_body"> 
<p class="Team_Description">Hive Voltage 3774 is the Senior 
(and Junior) 
Engineering Team at Bayonne High School. The team 
is a part of the Senior Engineering class available 
at Bayonne High School. This team has the most experienced 
students for FTC. Many of them are highly capable students 
who had done various stem activities. We plan on learning 
several aspects of engineering this season but we also intend to 
have fun. 
Our main goal however is to grow as a team. We plan to grow 
as individuals and to collaborate as a unit or a team. 
Also, we plan to expose our community to the wonderful 
applications of robotics, and to excel in many parts of real 
engineering and real world applications. Hence we are, 
HIVE VOLTAGE 3774. #Hivevoltage #Gobees</p> 
</div> 
</div> 
</body> 
</html>

CSS

.Banner 
{ 
height: 200px; 
width: 1350px; 
} 

.body 
{ 
margin-left: 200px; 
margin-right: 200px; 
margin-top: 50px; 
margin-bottom: 100px; 
} 
.Banner img 
{ 
    vertical-align:top; 
} 

body 
{ 
margin: 0; 
} 


.li_nav 
{ 
float: left; 
display:inline-block; 
font-family: 'Roboto Slab', serif; 
} 

.nav 
{ 
list-style-type: none; 
margin: 0; 
padding: 0; 
overflow: hidden; 
min-width: 1350px; 
} 

a:link, a:visited 
{ 
display:inline-block; 
width: 182.7px; 
padding-top: 12px; 
padding-right: 5px; 
padding-bottom: 14px; 
padding-left: 5px; 
font-weight: bold; 
color: #FFFFFF; 
background-color: #990000; 
text-align: center; 
text-decoration: none; 
font-family: 'Roboto Slab', serif; 
} 

a:hover, a:active 
{ 
background-color: #B20000; 
} 

#page{ 
    width: 1000px; 
    margin-left: 0px; 
    margin-right: 0px; 
} 


.body 
{ 
height: 1350px; 
} 

.main_header 
{ 
text-align: center; 
padding-top: 5px; 
padding-right: 5px; 
padding-bottom: 15px; 
padding-left: 5px; 
font-family: 'Roboto Slab', serif; 
} 

.main_body 
{ 
padding-bottom: 100px; 
} 

.Team_Description 
{ 
font-size: 150%; 
font-family: 'Roboto Slab', serif; 
}

該網站是robotichive3774.com

來源

2014-09-25 user3362546

這是因爲應用在那裏默認的錨樣式。在CSS中添加以下樣式。的

a.Banner_Link 
{ 
    padding:0 !important; 
}

來源

2014-09-25 12:14:47

沒有工作。更新了網站。 – user3362546 2014-09-25 12:17:55

適用'！重要'。我會更新答案。 – 2014-09-25 12:19:20

我很快就會接受你的回答，謝謝！ – user3362546 2014-09-25 12:21:59

而不是使用!important標籤，你可以做這樣的：

.Banner a { 
    padding: 0; 
}

您應該避免使用的重要標籤，除非絕對必要，而是試圖讓你的CSS規則更強大..看到這SO回答於!importanthttps://stackoverflow.com/a/3706876/1563558

來源

2014-09-25 13:10:44

當我試圖把我的旗幟作爲圖像，它不正確顯示？

回答

相關問題