質問編集履歴

1

Add image.

2019/05/25 19:22

投稿

icoder
icoder

スコア14

test CHANGED
File without changes
test CHANGED
@@ -8,15 +8,31 @@
8
8
 
9
9
  ### 発生している問題
10
10
 
11
- 背景に余白ができる。
11
+ 右と下に余白ができる。
12
12
 
13
- 右側だけに余白ができる。
13
+ ![イメージ説明](f8a378512fc5db62f024d566d4cfb363.png)
14
-
15
-
16
14
 
17
15
  ### 該当のソースコード
18
16
 
19
17
  HTML
18
+
19
+ <!DOCTYPE html>
20
+
21
+ <html lang="en">
22
+
23
+ <head>
24
+
25
+ <meta charset="UTF-8">
26
+
27
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
28
+
29
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
30
+
31
+ <title>Document</title>
32
+
33
+ <link rel="stylesheet" href="style.css">
34
+
35
+ </head>
20
36
 
21
37
  <body>
22
38
 
@@ -44,6 +60,8 @@
44
60
 
45
61
  </body>
46
62
 
63
+ </html>
64
+
47
65
 
48
66
 
49
67
  CSS
@@ -57,8 +75,6 @@
57
75
  }
58
76
 
59
77
  .video-wrap{
60
-
61
- width: 100%;
62
78
 
63
79
  height: 100vh;
64
80
 
@@ -80,11 +96,25 @@
80
96
 
81
97
  left: 50%;
82
98
 
83
- transform: translate(-50%);
99
+ transform: translate(-50%,-50%);
84
100
 
85
- color: white;
101
+ color: #000;
86
102
 
87
103
  text-align: center;
104
+
105
+ }
106
+
107
+ h1{
108
+
109
+ font-size: 60px;
110
+
111
+ }
112
+
113
+ h3{
114
+
115
+ font-size: 20px;
116
+
117
+ padding: 20px;
88
118
 
89
119
  }
90
120
 
@@ -95,3 +125,29 @@
95
125
  padding: 30px;
96
126
 
97
127
  }
128
+
129
+ .btn{
130
+
131
+ text-decoration: none;
132
+
133
+ border: 1px solid #fff;
134
+
135
+ padding: 20px;
136
+
137
+ color: #fff;
138
+
139
+ display: inline-block;
140
+
141
+ border-radius: 5px;
142
+
143
+ font-weight: bold;
144
+
145
+ }
146
+
147
+ .btn:hover{
148
+
149
+ color: #000;
150
+
151
+ background: #fff;
152
+
153
+ }