This repository has been archived by the owner on Mar 15, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
contact.html
141 lines (126 loc) · 6.56 KB
/
contact.html
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
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>オフィスチェア ゲーミングチェア</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<div class="header-wraper">
<!-- navi -->
<nav class="navbar navbar-expand-sm navbar-light bg-dark text-white">
<!-- logo -->
<a class="navbar-brand" href="./index.html"><img src="./img/logo.jpg" alt="logo" class="img-fluid"></a>
<!-- menu button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon text-wi"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mx-auto">
<li class="nav-item active">
<a class="nav-link text-white text-center h5 align-middle" href="./index.html">Home <span
class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link text-white text-center h5" href="./brands.html">Brands</a>
</li>
<li class="nav-item">
<a class="nav-link text-white text-center h5" href="./pickups.html">Pickups</a>
</li>
<li class="nav-item">
<a class="nav-link text-white text-center h5" href="./contact.html">Contact</a>
</li>
</ul>
<a class="text-white" href="#"><i class="fab fa-twitter-square h2 px-2"></i></a>
<a class="text-white" href="#"><i class="far fa-envelope h2 px-2"></i></a>
</div>
</nav>
</div>
</header>
<body>
<main>
<div class="page-top pt-4">
<h4 class="h1">Contact</h4>
<p>ご相談、ご意見、お問い合わせは以下のフォームへ</p>
<p>*は必須です</p>
</div>
<hr>
<form action="" method="post" class="my-4" novalidate>
<div class="form-group row">
<div class="col-sm-3 d-flex justify-content-center align-items-center">
<label for="name">お名前*</label>
</div>
<div class="col-sm-9">
<input type="name" name="name" id="name" class="form-control required" placeholder="お名前をご記入ください">
</div>
</div>
<div class="form-group row">
<div class="col-sm-3 d-flex justify-content-center align-items-center">
<label for="email">メールアドレス*</label>
</div>
<div class="col-sm-9">
<input type="email" name="email" id="email" class="form-control required" placeholder="メールアドレスをご記入ください">
</div>
</div>
<div class="row">
<div class="col-sm-3 d-flex justify-content-center align-items-center">
<label for="class" class="align-middle">お問い合わせの種類</label>
</div>
<div class="col-sm-9">
<div class="form-check">
<input class="form-check-input" type="radio" name="class" id="exampleRadios1" value="question"
checked>
<label class="form-check-label" for="exampleRadios1">
質問
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="class" id="exampleRadios2" value="opinion">
<label class="form-check-label" for="exampleRadios2">
ご意見
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="class" id="exampleRadios3" value="others">
<label class="form-check-label" for="exampleRadios3">
その他
</label>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-sm-3 d-flex justify-content-center align-items-center">
<label for="content">お問い合わせ内容*</label>
</div>
<div class="col-sm-9">
<textarea class="form-control required" name="content" id="content" rows="3"></textarea>
</div>
</div>
<div class="error text-danger"></div>
<button type="submit" formaction="./thanks.html" class="btn btn-primary">送信</button>
</form>
</main>
</body>
<footer class="bg-dark text-white mt-4 py-4">
<div class="row mx-0">
<div class="col-md-4">
©Copyright 2020 Tsukasa INOUE<br>All Rights Reserved
</div>
<div class="col-md-4"><img src="./img/logo.jpg" alt="logo" class="img-fluid w-50"></div>
<div class="col-md-4">
For your best Chair Life
</div>
</div>
</footer>
<!-- jQuery、Popper.js、Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
<script src="./js/main.js"></script>
</body>
</html>