質問編集履歴

5

修正

2017/06/29 10:36

投稿

miramikan
miramikan

スコア26

test CHANGED
File without changes
test CHANGED
@@ -80,276 +80,166 @@
80
80
 
81
81
 
82
82
 
83
- body{
83
+ .main{
84
-
84
+
85
- width: 100%;
85
+ width: 100%;
86
+
86
-
87
+ height: 1000px;
88
+
89
+ padding: 100px 0px;
90
+
87
- margin: 0px;
91
+ margin: 0px;
88
-
89
- padding: 0px;
92
+
90
-
91
- }
93
+ }
94
+
95
+
96
+
97
+
98
+
99
+
100
+
101
+ .photo-title{
102
+
103
+ font-size:25px;
104
+
105
+ margin-left:150px;
106
+
107
+ border-bottom:3px solid #23c1ea;
108
+
109
+ width:375px;
110
+
111
+ max-width: 100%;
112
+
113
+ height: auto;
114
+
115
+ }
116
+
117
+
118
+
119
+ .whole-photo{
120
+
121
+ margin-left:70px;
122
+
123
+ margin-top: 50px;
124
+
125
+ position:relative;
126
+
127
+ }
128
+
129
+
130
+
131
+
132
+
133
+ .photoframe {
134
+
135
+ position: relative;
136
+
137
+ display: inline;
138
+
139
+ float: left;
140
+
141
+ width: 470px;
142
+
143
+ height: 430px;
144
+
145
+ overflow: hidden;
146
+
147
+ margin: 0 10px 20px;
148
+
149
+ margin-left:80px;
150
+
151
+ padding: 15px;
152
+
153
+ background: #ffffff;
154
+
155
+ border: 1px solid rgba(0, 0, 0, 0.3);
156
+
157
+ text-align: center;
158
+
159
+ -webkit-border-radius: 2px;
160
+
161
+ -moz-border-radius: 2px;
162
+
163
+ border-radius: 2px;
164
+
165
+ -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
166
+
167
+ -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
168
+
169
+ box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
170
+
171
+ z-index: 1;
172
+
173
+ }
174
+
175
+
176
+
177
+ .photoframe .photo {
178
+
179
+ width: 470px;
180
+
181
+ height: 313px;
182
+
183
+ overflow: hidden;
184
+
185
+ margin: 0 0 10px;
186
+
187
+ padding: 0;
188
+
189
+ -moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2);
190
+
191
+ -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2);
192
+
193
+ box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2);ss
194
+
195
+ }
196
+
197
+
198
+
199
+ .photoframe img {
200
+
201
+ position: relative;
202
+
203
+ display: block;
204
+
205
+ margin: 0;
206
+
207
+ padding: 0;
208
+
209
+ z-index: -1;
210
+
211
+ width:470px;
212
+
213
+ height:313px;
214
+
215
+
216
+
217
+ }
218
+
219
+
220
+
221
+
222
+
223
+
224
+
225
+
226
+
227
+
228
+
229
+ .box:after {
230
+
231
+ content: ' ';
232
+
233
+ clear: both;
234
+
235
+ display: block;
236
+
237
+ }
238
+
239
+
92
240
 
93
241
 
94
242
 
95
-
96
-
97
- main{
98
-
99
- width: 100%;
100
-
101
- height: 1000px;
102
-
103
- padding: 100px 0px;
104
-
105
- margin: 0px;
106
-
107
-
108
-
109
- }
110
-
111
-
112
-
113
- img {
114
-
115
- max-width: 100%;
116
-
117
- height: auto;
118
-
119
- }
120
-
121
- body{
122
-
123
- max-width: 100%;
124
-
125
- height: auto;
126
-
127
- }
128
-
129
-
130
-
131
- .photo-title{
132
-
133
- font-size:25px;
134
-
135
- margin-left:150px;
136
-
137
- border-bottom:3px solid #23c1ea;
138
-
139
- width:375px;
140
-
141
- max-width: 100%;
142
-
143
- height: auto;
144
-
145
- }
146
-
147
-
148
-
149
- .whole-photo{
150
-
151
- margin-left:70px;
152
-
153
- margin-top: 50px;
154
-
155
- position:relative;
156
-
157
- }
158
-
159
-
160
-
161
-
162
-
163
- .photoframe {
164
-
165
- position: relative;
166
-
167
- display: inline;
168
-
169
- float: left;
170
-
171
- width: 340px;
172
-
173
- height: 430px;
174
-
175
- overflow: hidden;
176
-
177
- margin: 0 10px 20px;
178
-
179
- margin-left:80px;
180
-
181
- padding: 15px;
182
-
183
- background: #ffffff;
184
-
185
- border: 1px solid rgba(0, 0, 0, 0.3);
186
-
187
- text-align: center;
188
-
189
- -webkit-border-radius: 2px;
190
-
191
- -moz-border-radius: 2px;
192
-
193
- border-radius: 2px;
194
-
195
- -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
196
-
197
- -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
198
-
199
- box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
200
-
201
- z-index: 1;
202
-
203
- }
204
-
205
-
206
-
207
- .photoframe .photo {
208
-
209
- width: 340px;
210
-
211
- height: 385px;
212
-
213
- overflow: hidden;
214
-
215
- margin: 0 0 10px;
216
-
217
- padding: 0;
218
-
219
- -moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2);
220
-
221
- -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2);
222
-
223
- box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2);
224
-
225
- }
226
-
227
-
228
-
229
- .photoframe img {
230
-
231
- position: relative;
232
-
233
- display: block;
234
-
235
- margin: 0;
236
-
237
- padding: 0;
238
-
239
- z-index: -1;
240
-
241
- width:500px;
242
-
243
- height:359px;
244
-
245
- }
246
-
247
-
248
-
249
-
250
-
251
- .tape{
252
-
253
- position:relative;
254
-
255
- bottom:30px;
256
-
257
- left:30px;
258
-
259
- }
260
-
261
-
262
-
263
-
264
-
265
- .note{
266
-
267
- width:390px;
268
-
269
- height:460px;
270
-
271
- float:right;
272
-
273
- margin-right:160px;
274
-
275
- position: relative;
276
-
277
- background-color: #ffffe7;
278
-
279
- background-image:
280
-
281
- linear-gradient(rgba(241,207,164,0.5) .1em, transparent .1em);
282
-
283
- background-size: 100% 1.5em;
284
-
285
- line-height:1.5em;
286
-
287
- max-width: 100%;
288
-
289
-
290
-
291
- }
292
-
293
- #note{
294
-
295
- -moz-transform: rotate(-4deg);
296
-
297
- -webkit-transform: rotate(-4deg);
298
-
299
- }
300
-
301
-
302
-
303
- .in{
304
-
305
- padding-bottom: 20px;
306
-
307
- font-size: 28px;
308
-
309
- margin-top: 5px;
310
-
311
-
312
-
313
- }
314
-
315
-
316
-
317
-
318
-
319
- .letters{
320
-
321
- padding-top:10px;
322
-
323
- padding-left:20px;
324
-
325
- padding-right:20px;
326
-
327
- font-size:28px;
328
-
329
- line-height:130%;
330
-
331
- }
332
-
333
-
334
-
335
-
336
-
337
- .box:after {
338
-
339
- content: ' ';
340
-
341
- clear: both;
342
-
343
- display: block;
344
-
345
- }
346
-
347
-
348
-
349
-
350
-
351
-
352
-
353
243
 
354
244
 
355
245
 

4

間違え

2017/06/29 10:36

投稿

miramikan
miramikan

スコア26

test CHANGED
File without changes
test CHANGED
@@ -14,7 +14,7 @@
14
14
 
15
15
  ```HTML
16
16
 
17
- <div class="main">
17
+
18
18
 
19
19
  <p class="photo-title">####</p>
20
20
 

3

修正

2017/06/29 10:21

投稿

miramikan
miramikan

スコア26

test CHANGED
File without changes
test CHANGED
@@ -16,7 +16,7 @@
16
16
 
17
17
  <div class="main">
18
18
 
19
- <p class="photo-title">####<p>
19
+ <p class="photo-title">####</p>
20
20
 
21
21
 
22
22
 

2

間違え

2017/06/29 10:16

投稿

miramikan
miramikan

スコア26

test CHANGED
File without changes
test CHANGED
@@ -348,7 +348,7 @@
348
348
 
349
349
 
350
350
 
351
- }
351
+
352
352
 
353
353
 
354
354
 

1

間違え

2017/06/29 10:15

投稿

miramikan
miramikan

スコア26

test CHANGED
File without changes
test CHANGED
@@ -1,6 +1,6 @@
1
1
  pic.jpgのwidthをもう少し広い幅に変えたいのですが、
2
2
 
3
- htmlの方に直接<img src="pic.png" width="##" height="##">と書いても、cssの
3
+ htmlの方に直接<img src="pic.jpg" width="##" height="##">と書いても、cssの
4
4
 
5
5
  .photoframe img に記載しても幅が変わりません。
6
6
 
@@ -88,6 +88,8 @@
88
88
 
89
89
  padding: 0px;
90
90
 
91
+ }
92
+
91
93
 
92
94
 
93
95