質問編集履歴

1

写真の追加とcode囲みました

2019/01/02 07:41

投稿

tomotomotomo
tomotomotomo

スコア18

test CHANGED
File without changes
test CHANGED
@@ -12,6 +12,8 @@
12
12
 
13
13
  HTMLの方は
14
14
 
15
+ ```
16
+
15
17
  <div class="gallery_wrap">
16
18
 
17
19
  <div class="gallery_box box01">
@@ -76,8 +78,124 @@
76
78
 
77
79
  </div>
78
80
 
81
+ ```
82
+
79
83
  にしています。
80
84
 
85
+
86
+
87
+ CSSは
88
+
89
+ ```
90
+
91
+ .gallery_wrap{
92
+
93
+ display: flex;
94
+
95
+ width: 70%;
96
+
97
+ height: auto;
98
+
99
+ margin: 20px auto;
100
+
101
+
102
+
103
+ }
104
+
105
+
106
+
107
+ .gallery_box{
108
+
109
+ width: 33%;
110
+
111
+ height: 100%;
112
+
113
+ margin: 10px;
114
+
115
+
116
+
117
+ }
118
+
119
+
120
+
121
+
122
+
123
+ .box3{
124
+
125
+ display: flex;
126
+
127
+ flex-direction: column;
128
+
129
+ }
130
+
131
+
132
+
133
+ .box4{
134
+
135
+ display: flex;
136
+
137
+ flex-direction: column;
138
+
139
+ }
140
+
141
+
142
+
143
+ .box8{
144
+
145
+ display: flex;
146
+
147
+ flex-direction: column;
148
+
149
+ }
150
+
151
+
152
+
153
+ .gallery_box img{
154
+
155
+ width: 100%;
156
+
157
+ height: 100%;
158
+
159
+ object-fit: cover;
160
+
161
+ }
162
+
163
+
164
+
165
+ .box03 img{
166
+
167
+ width: 100%;
168
+
169
+ height: 50%;
170
+
171
+ }
172
+
173
+
174
+
175
+ .box04 img{
176
+
177
+ width: 100%;
178
+
179
+ height: 50%;
180
+
181
+ }
182
+
183
+
184
+
185
+ .box08 img{
186
+
187
+ width: 100%;
188
+
189
+ height: 50%;
190
+
191
+ }
192
+
193
+ ```
194
+
81
195
  よろしくお願いいたします。
82
196
 
197
+
198
+
83
- ![イメージ説明](f8e4f07d912f89da2adb3488aedb6eb8.jpeg)
199
+ ![イメージ説明](c0e52fd11a4c5ddaa99cb68445673a66.jpeg)
200
+
201
+ ![イメージ説明](fa2e9a1e12b76d66319d1690ac544827.jpeg)