質問編集履歴
1
CSSにHTMLコードを誤って載せていた為
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -79,62 +79,67 @@
|
|
|
79
79
|
```
|
|
80
80
|
|
|
81
81
|
```css
|
|
82
|
-
<!DOCTYPE html>
|
|
83
|
-
<html lang="jp">
|
|
84
|
-
<head>
|
|
85
|
-
<meta charset="utf-8">
|
|
86
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
87
|
-
<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
|
|
88
|
-
<link rel="stylesheet" href="CSS/style.css">
|
|
89
82
|
|
|
83
|
+
body {
|
|
84
|
+
font-family: `A-OTF 新丸ゴ Pro,H`;
|
|
85
|
+
color: #FFFFFF;
|
|
86
|
+
width: 1920px;
|
|
87
|
+
background-color: #1D1D1D;
|
|
88
|
+
}
|
|
90
89
|
|
|
90
|
+
p {
|
|
91
|
-
|
|
91
|
+
margin: 0;
|
|
92
|
-
|
|
92
|
+
display: inline-block;
|
|
93
|
+
font-size: 25px;
|
|
94
|
+
}
|
|
93
95
|
|
|
94
|
-
<body>
|
|
95
96
|
|
|
96
97
|
|
|
98
|
+
footer {
|
|
99
|
+
width: 100%;
|
|
97
|
-
|
|
100
|
+
height: 651px;
|
|
98
|
-
<h1>TEAM GRAY</h1>
|
|
99
|
-
<div id="ham-menu">
|
|
100
|
-
|
|
101
|
+
}
|
|
101
|
-
<li><a href="#">WORKS</a></li>
|
|
102
|
-
<li><a href="#">SERVICE</a></li>
|
|
103
|
-
<li><a href="#">ABOUT</a></li>
|
|
104
|
-
<li><a href="#">CONTACT</a></li>
|
|
105
|
-
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
|
|
106
|
-
<li><a href="#"><i class="fab fa-twitter-square"></i></a></li>
|
|
107
|
-
<li><a href="#"><i class="fab fa-facebook-square"></i></a></li>
|
|
108
|
-
</ul>
|
|
109
|
-
</div>
|
|
110
|
-
<div id="menu-background"></div>
|
|
111
102
|
|
|
103
|
+
.footer-box1 {
|
|
104
|
+
margin: 0;
|
|
105
|
+
width: 50%;
|
|
106
|
+
height: 651px;
|
|
107
|
+
position: relative;
|
|
108
|
+
float: left;
|
|
109
|
+
}
|
|
112
110
|
|
|
111
|
+
.footer-box2 {
|
|
112
|
+
margin: 0;
|
|
113
|
+
width: 50%;
|
|
114
|
+
height: 651px;
|
|
115
|
+
position: relative;
|
|
116
|
+
float: left;
|
|
117
|
+
}
|
|
113
118
|
|
|
114
|
-
<footer>
|
|
115
|
-
<div class="footer-box1">
|
|
116
|
-
<h1>TEAM GRAY</h1>
|
|
117
|
-
<ul class="footer-left">
|
|
118
|
-
<li><a href="#">TOP</a></li>
|
|
119
|
-
<li><a href="#">WORKS</a></li>
|
|
120
|
-
<li><a href="#">SERVICE</a></li>
|
|
121
|
-
<li><a href="#">ABOUT</a></li>
|
|
122
|
-
<li><a href="#">CONTACT</a></li>
|
|
123
|
-
</ul>
|
|
124
|
-
</div>
|
|
125
|
-
<div class="footer-box2">
|
|
126
|
-
<ul class="footer-right">
|
|
127
|
-
<li><a href="#"><p>INSTAGRAM</p><p></p><i class="fab fa-instagram"></i></a></li>
|
|
128
|
-
<li><a href="#"><p>TWITTER</p><i class="fab fa-twitter-square"></i></a></li>
|
|
129
|
-
<li><a href="#"><p>FACEBOOK</p><i class="fab fa-facebook-square"></i></a></li>
|
|
130
|
-
<li><p>Q&A</p></li>
|
|
131
|
-
</ul>
|
|
132
|
-
</div>
|
|
133
|
-
</footer>
|
|
134
|
-
</body>
|
|
135
119
|
|
|
136
|
-
</html>
|
|
137
120
|
|
|
121
|
+
.footer-left {
|
|
122
|
+
position: absolute;
|
|
123
|
+
top: 192px;
|
|
124
|
+
<--! パディングが40px空いてる -->
|
|
125
|
+
padding-left: 0;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
.footer-right {
|
|
129
|
+
position: absolute;
|
|
130
|
+
top: 189px;
|
|
131
|
+
right: 0;
|
|
132
|
+
left: 0:
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
footer li {
|
|
136
|
+
margin-bottom: 52px;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
footer i {
|
|
140
|
+
margin-left: 20px;
|
|
141
|
+
}
|
|
142
|
+
|
|
138
143
|
```
|
|
139
144
|
|
|
140
145
|
# ご回答のほどよろしくお願いいたします。
|