UI설계 및 구현 -웹프로그래밍
CSS - a테그 속성 연습
햄찌개
2020. 9. 17. 10:12
<!DOCTYPE html>
<html>
<head>
<style>
a:link{
color:black;
font-size: 100px;
}
a:visited{
color:yellow;
}
a:hover{
color:red;
font-size: 10px;
}
a:actived{
color:blue;
}
</style>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<a href = "http://www.google.com">구그그그그그그그글</a>
</body>
</html><!DOCTYPE html>
<html>
<head>
<style>
#menu01 {
height: 500px;
background-color: #9BCDC4;
margin-left: 20px;
margin-top:50px;
padding: 20px;
text-decoration: none;
}
#menu01:hover {
text-decoration:underline;
font-size: 100px;
}
#menu02 {
height: 500px;
background-color: #FFF111;
margin-left: 20px;
margin-top:50px;
padding: 20px;
text-decoration: none;
}
#menu02:hover {
text-decoration:underline;
font-size: 100px;
}
#menu03 {
height: 500px;
background-color: #33864C;
margin-left: 20px;
margin-top:50px;
padding: 20px;
text-decoration: none;
}
#menu03:hover {
text-decoration:underline;
font-size: 100px;
}
#menu04 {
height: 500px;
background-color: #FF4821;
margin-left: 20px;
padding: 20px;
margin-top:50px;
text-decoration: none;
}
#menu04:hover {
text-decoration:underline;
font-size: 100px;
}
ul li{
list-style: none;
float: left;
}
</style>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<br>
<br>
<ul>
<li><a id="menu01" href="">홍길동</a></li>
<li><a id="menu02" href="">김두한</a></li>
<li><a id="menu03" href="">강감찬</a></li>
<li><a id="menu04" href="">세종대왕</a></li>
</ul>
</body>
</html>