CSS: A νκ·Έ μμ± (link, visited, hover, active)
a:link : λ°©λ¬Έ μ λ§ν¬ μνμ΄λ€.
a:visited : λ°©λ¬Έ ν λ§ν¬ μνμ΄λ€.
a:hover : λ§μ°μ€ μ€λ² νμ λ λ§ν¬ μνμ΄λ€.
a:active : ν΄λ¦ νμ λ λ§ν¬ μνμ΄λ€.
μμ
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
a:link{
text-decoration:none;
color: black;}
a:visited{
text-decoration:none;
color: black;}
a:hover{
text-decoration:none;
color: white;}
a:active{
text-decoration:none;
color: white;}
</style>
</head>
<body>
<header> <h2>1λΆ λμ€νμ΅νκΈ°</h2></header>
<nav>
<font size=4><b>
<span id="id"> <%=userid%></span> 
<span id="loginbtn"><a href=lmslogin?cmd=loginform>λ‘κ·ΈμΈ</a> </span>
<span id="logout"><a href="javascript:logout();">λ‘κ·Έμμ</a> </span>
<span id="joinmem"><a href="lmslogin?cmd=joinmem">νμκ°μ
</a> </span>
<span id="my_info"><a href="lmslogin?cmd=my_info">λ΄μ 보 보λ¬κ°κΈ°</a> </span>
<a href="javascript:loginOK();">λμμ νμ΅</a> 
<a href="/index.jsp">νμΌλ‘</a></b>
</font>
</nav>
|
cs |
μ€νκ²°κ³Ό:
λμμ νμ΅μ λ§μ°μ€ 컀μλ₯Ό κ°μ Έλ€ λμ λ
HTML ν μ΄λΈ λ§μ°μ€μ€λ² μ΄λ²€νΈ
1
2
3
4
|
<style>
.changeColor {
background-color: #bff0ff;}
</style>
|
cs |
μμ΄ λ°λλ cssμ½λ
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<script>
$(document).ready(function(){
changeColor();
clickTd();
clickTr();
})
function changeColor(){
$('#table tr').mouseover(function(){
$(this).addClass('changeColor');
}).mouseout(function() {
$(this).removeClass('changeColor');
});
}
</script>
|
cs |
jQueryλ λ ν¨μλ‘ tableμ trμ μ°Ύμ λ§μ°μ€λ₯Ό μ¬λ¦¬λ©΄ changeColorλΌλ classλ₯Ό λμ μΌλ‘ μμ±ν΄μ£Όλ ν¨μμ λλ€.
λ§μ°μ€ 컀μκ° tr μμμ λ΄λ €κ°λ©΄ μμ±ν΄μ€ classκ° μμ΄μ ΈμΌνκΈ°μ removeClass()ν¨μλ₯Ό μ¬μ©νμ¬ μμ μ€λλ€.
μ€ν κ²°κ³Ό :
첫λ²μ§Έ trμ 컀μλ₯Ό μ¬λ Έμ λ
λκΈ