質問編集履歴

1

コード全体を書きました

2019/11/22 06:45

投稿

gooodmnya
gooodmnya

スコア9

test CHANGED
File without changes
test CHANGED
@@ -16,19 +16,157 @@
16
16
 
17
17
 
18
18
 
19
- html
19
+ <!DOCTYPE html>
20
20
 
21
- class名→ content-first
21
+
22
+
23
+ <html lang="ja">
24
+
25
+ <head>
26
+
27
+ <meta charset="utf-8">
28
+
29
+ <title>Airbnbでお家、アパート、お部屋をシェアしよう</title>
30
+
31
+ <link rel="stylesheet" type="text/css" href="style.css">
32
+
33
+ <link rel="shortcut icon" type="image/png" href="../pictures/icon.png">
34
+
35
+ <link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
36
+
37
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
38
+
39
+ </head>
40
+
41
+ <body>
42
+
43
+ <div class="header row">
44
+
45
+ <div class="col-sm-12">
46
+
47
+ <ul class="nav">
48
+
49
+ <li class="nav-item">
50
+
51
+ <a class="nav-link active" href="#">Active</a>
52
+
53
+ </li>
54
+
55
+ <li class="nav-item">
56
+
57
+ <a class="nav-link" href="#">Link</a>
58
+
59
+ </li>
60
+
61
+ <li class="nav-item">
62
+
63
+ <a class="nav-link" href="#">Link</a>
64
+
65
+ </li>
66
+
67
+ <li class="nav-item">
68
+
69
+ <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
70
+
71
+ </li>
72
+
73
+ </ul>
74
+
75
+ </div>
76
+
77
+ </div>
78
+
79
+
80
+
81
+ <div class="content-first row">
82
+
83
+
84
+
85
+ <div class="col-sm-8">
86
+
87
+ </div>
88
+
89
+
90
+
91
+ <div class="col-sm-3">
92
+
93
+ <form>
94
+
95
+ <div class="form-group">
96
+
97
+ <label for="exampleInputEmail1">Email address</label>
98
+
99
+ <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
100
+
101
+ <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
102
+
103
+ </div>
104
+
105
+ <div class="form-group">
106
+
107
+ <label for="exampleInputPassword1">Password</label>
108
+
109
+ <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
110
+
111
+ </div>
112
+
113
+ <div class="form-group form-check">
114
+
115
+ <input type="checkbox" class="form-check-input" id="exampleCheck1">
116
+
117
+ <label class="form-check-label" for="exampleCheck1">Check me out</label>
118
+
119
+ </div>
120
+
121
+ <button type="submit" class="btn btn-primary">Submit</button>
122
+
123
+ </form>
124
+
125
+ </div>
126
+
127
+ </div>
128
+
129
+
130
+
131
+ <div class="row content-second">
132
+
133
+ <div class="col-sm-6">
134
+
135
+ <h1>Airbnbでホストするこれだけの理由</h1>
136
+
137
+ </div>
138
+
139
+
140
+
141
+ <div class="col-sm-6">
142
+
143
+ <h1>困ったときも安心</h1>
144
+
145
+ </div>
146
+
147
+ </div>
148
+
149
+
150
+
151
+ </body>
152
+
153
+ </html>
22
154
 
23
155
 
24
156
 
25
157
  css
26
158
 
159
+ .header {
160
+
161
+ height:80px;
162
+
163
+ }
164
+
27
165
 
28
166
 
29
167
  .content-first {
30
168
 
31
- background-image: url("../pictures/first.jpg");
169
+ background-image: url(../pictures/first.png);
32
170
 
33
171
  background-size:cover;
34
172