2013-07-05 1 views
0

http://planetminecraft.com으로 이동하면 링크를 볼 때 링크가있는 페이지에있을 때 음영으로 표시됩니다.a : 계속 사람이 페이지에있는 동안 활성화?

같은 일을하고 싶지만 그림자가없는 검은 색 배경으로하고 싶습니다. 여기 내 HTML과 CSS

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<link rel="stylesheet" href="style.css"> 
<title>Testing layouts</title> 
</head> 

<body> 

<div id="maincontainer"> 

<ul> 
    <li><a href="#servers">SERVERS</a></li> 
    <li><a href="#skins">SKINS</a></li> 
    <li><a href="#resource-packs">RESOURCE PACKS</a></li> 
    <li><a href="#builds">BUILDS</a></li> 
    <li><a href="#mods">MODS</a></li> 
    <li><a href="#forum">FORUM</a></li> 
</ul> 

Testing text Testing text Testing text Testing text Testing text 
Testing text Testing text Testing text Testing text Testing text 
Testing text Testing text Testing text Testing text Testing text 
Testing text Testing text Testing text Testing text Testing text 
Testing text Testing text Testing text Testing text Testing text 
Testing text Testing text Testing text Testing text Testing text 
Testing text Testing text Testing text Testing text Testing text 

</div> 

</body> 
</html> 

CSS에서만은 A a:hover a:active li li:hover ul

볼 필요가

html, body { 
    height: 100%; 
    margin: 0; 
    background: #A3A3A3; 
    background-image: linear-gradient(180deg, #7D7D7D, #7D7D7D 50px, transparent 57px, transparent 140%); 
} 
#maincontainer { 
    min-height: 100%; 
    width: 960px; 
    min-width: 600px; 
    margin: auto; 
    border: ridge; 
    border-color: #919191; 
    border-top: 0; 
    border-bottom: 0; 
    background: rgba(255,255,255,0.35); 
    padding-left: 16px; 
    padding-right: 16px; 
} 

ul { 
list-style-type:none; 
margin:0; 
padding:0; 
overflow:hidden; 
padding-top: 6px; 
} 

li { 
float:left; 
margin-right: 12px; 
border: groove; 
border-width: 2px; 
border-color: #969696; 
} 

a { 
display:block; 
padding-left: 5px; 
padding-right: 5px; 
height: 38px; 
background-color:#7D7D7D; 
text-align: center; 
text-decoration: none; 
line-height: 37px; 
color: #EDEDED; 
font-weight: bold; 
font-family: impact; 
font-size: 1.8em; 
} 

li:hover { 
float:left; 
margin-right: 12px; 
border: ridge; 
border-width: 2px; 
border-color: #969696; 
} 

a:hover { 
color: white; 
} 

a:active { 
background-color: black; 
} 

는 또한 CSS와 함께이 가능하거나 자바 스크립트를 필요로 않습니다.

답변

0

당신이 찾고있는 것의 solution입니다. JS가 필요하지 않습니다.

관련 문제