• 코드:
​x
 
1
<!DOCTYPE html>
2
<html lang="ko">
3
​
4
<head>
5
    <meta charset="UTF-8">
6
    <title>CSS3 Buttons</title>
7
    <style>
8
        .btn {
9
            background-color: #87CEEB;
10
            padding: 15px 30px;
11
            margin: 2px;
12
            border: none;
13
            color: black;
14
            text-align: center;
15
            text-decoration: none;
16
            font-size: 16px;
17
            display: inline-block;
18
            cursor: pointer;
19
        }
20
    </style>
21
</head>
22
​
23
<body>
24
​
25
    <h1>다양한 요소로 만드는 버튼</h1>
26
​
27
    <h3>기본 버튼</h3>
28
    <button>button 태그</button>
29
    <a href="#">a 태그</a>
30
    <input type="button" value="input 태그">
31
​
32
    <h3>CSS로 버튼 스타일 설정</h3>
33
    <button class="btn">button 태그</button>
34
    <a href="#" class="btn">a 태그</a>
35
    <input type="button" value="input 태그" class="btn">
36
​
37
</body>
38
​
39
</html>