teratail
回答率
85.47%
質問するログイン新規登録
トップに関する質問font-familyが効かない原因がわかりません

編集履歴

質問編集履歴

6

画像の添付

2020/02/11 06:05

投稿

reo_fukkase
reo_fukkase

スコア50

test CHANGED
File without changes
test CHANGED
@@ -477,3 +477,7 @@
477
477
  ![イメージ説明](eddfc8ed67b2c9c89c1b1b0d2387c7eb.png)
478
478
 
479
479
  ![イメージ説明](d499a9b88ae3fbea5a72b0051e5623db.png)
480
+
481
+ ![イメージ説明](83365e09adca8d045265a3349846f492.png)
482
+
483
+ ![イメージ説明](e9f45d6d2b90c3d47775e7be24ea3e14.png)

5

コードの修正

2020/02/11 06:05

投稿

reo_fukkase
reo_fukkase

スコア50

test CHANGED
File without changes
test CHANGED
@@ -90,7 +90,7 @@
90
90
 
91
91
  width:1425px;
92
92
 
93
- font-family: "Hiragino Kaku Gothic", "ヒラギノ角ゴ W3", "Hiragino Sans", "ヒラギノ角ゴシック W3", sans-serif;
93
+ font-family: "Hiragino Kaku Gothic W3", "ヒラギノ角ゴ W3", "Hiragino Sans", "ヒラギノ角ゴシック W3", sans-serif;
94
94
 
95
95
  }
96
96
 

4

コードの修正

2020/02/10 04:57

投稿

reo_fukkase
reo_fukkase

スコア50

test CHANGED
File without changes
test CHANGED
@@ -90,7 +90,7 @@
90
90
 
91
91
  width:1425px;
92
92
 
93
- font-family: "Hiragino Kaku Gothic Pro",Meiryo, Osaka,"MS PGothic",sans-serif;
93
+ font-family: "Hiragino Kaku Gothic", "ヒラギノ角ゴ W3", "Hiragino Sans", "ヒラギノ角ゴシック W3", sans-serif;
94
94
 
95
95
  }
96
96
 
@@ -100,6 +100,14 @@
100
100
 
101
101
  background-color:white;
102
102
 
103
+ position: fixed;
104
+
105
+ top:0;
106
+
107
+ width:100%;
108
+
109
+ z-index: 1000;
110
+
103
111
  .header-left{
104
112
 
105
113
  float:left;
@@ -152,123 +160,313 @@
152
160
 
153
161
  background-color:#da6b64;
154
162
 
163
+
164
+
165
+ text-decoration: none;
166
+
167
+ color:#fff;
168
+
169
+ font-size: 14px;
170
+
171
+ font-weight:300;
172
+
173
+ letter-spacing:1.5px;
174
+
175
+ border-radius: 25px;
176
+
177
+ padding:11px 40.5px;
178
+
179
+ margin-top: 16px;
180
+
181
+ margin-right:127px;
182
+
183
+ text-align: center;
184
+
185
+ &:hover{
186
+
187
+ background-color:#d84940;
188
+
189
+ }
190
+
191
+ }
192
+
193
+ }
194
+
195
+ }
196
+
197
+ .clear{
198
+
199
+ clear:both;
200
+
201
+ }
202
+
203
+ .title-top{
204
+
205
+ height:500px;
206
+
207
+ background-image:url("https://isara.life/wp-content/themes/isara_v2/img/main.jpg");
208
+
209
+ background-size:cover;
210
+
211
+ background-position: center center;
212
+
213
+ margin-top:75px;
214
+
215
+ .title-text{
216
+
217
+ padding-top:88px;
218
+
219
+ h2{
220
+
221
+ color:#333333;
222
+
223
+ line-height: 54px;
224
+
225
+ font-size:28px;
226
+
227
+ font-weight:700;
228
+
229
+ letter-spacing: 1.5px;
230
+
231
+ text-align: center;
232
+
233
+ }
234
+
235
+ img{
236
+
237
+ display:block;
238
+
239
+ height:111px;
240
+
241
+ margin-top:5px;
242
+
243
+ margin-left: auto;
244
+
245
+ margin-right:auto;
246
+
247
+ }
248
+
249
+ h3{
250
+
251
+ text-align:center;
252
+
253
+ color:#333333;
254
+
255
+ letter-spacing: 1.5px;
256
+
257
+ margin-top:40px;
258
+
259
+ font-size:20px;
260
+
155
261
  line-height: 22px;
156
262
 
157
- text-decoration: none;
158
-
159
- color:rgb(255, 255, 255);
160
-
161
- font-size: 14px;
162
-
163
- font-weight:300;
164
-
165
- letter-spacing:1.5px;
166
-
167
- border-radius: 25px;
168
-
169
- padding:11px 40px;
170
-
171
- margin-top: 16px;
172
-
173
- margin-right:127px;
174
-
175
- &:hover{
176
-
177
- background-color:#d84940;
178
-
179
- }
180
-
181
- }
182
-
183
- }
184
-
185
- }
186
-
187
- .title-top{
188
-
189
- height:500px;
190
-
191
- background-image:url("https://isara.life/wp-content/themes/isara_v2/img/main.jpg");
263
+ }
264
+
265
+ }
266
+
267
+ }
268
+
269
+ .recruitment{
270
+
271
+ height:600px;
272
+
273
+ background-color:#ebb94d;
274
+
275
+ .recruitment-first{
276
+
277
+ color:#fff;
278
+
279
+ text-align: center;
280
+
281
+ letter-spacing: 1.5px;
282
+
283
+ line-height: 32px;
284
+
285
+ padding-top:30px;
286
+
287
+ font-size:20px;
288
+
289
+ font-weight:300;
290
+
291
+ }
292
+
293
+ .recruitment-second{
294
+
295
+ color:#c7254e;
296
+
297
+ width:465px;
298
+
299
+ height:25px;
300
+
301
+ background-color:#f9f2f4;
302
+
303
+ margin-left:auto;
304
+
305
+ margin-right:auto;
306
+
307
+ font-weight:700;
308
+
309
+ font-size:18px;
310
+
311
+ border-radius: 5px;
312
+
313
+ text-align:center;
314
+
315
+ margin-top:15px;
316
+
317
+ font-family:Menlo, Monaco, Consolas, "Courier New", monospace;
318
+
319
+ letter-spacing: 1.5px;
320
+
321
+ }
322
+
323
+ a{
324
+
325
+ font-size:28px;
326
+
327
+ letter-spacing: 1.5px;
328
+
329
+ font-weight:500;
330
+
331
+ text-decoration: none;
332
+
333
+ width:1030px;
334
+
335
+ height:105px;
336
+
337
+ line-height: 105px;
338
+
339
+ background-color: #da6b64;
340
+
341
+ color:rgb(255, 255, 255);
342
+
343
+ display: block;
344
+
345
+ text-align: center;
346
+
347
+ margin-top:47px;
348
+
349
+ margin-left: auto;
350
+
351
+ margin-right: auto;
352
+
353
+ border-radius: 60px;
354
+
355
+ span{
356
+
357
+ margin-left:2.5px;
358
+
359
+ margin-right:2.5px;
360
+
361
+ }
362
+
363
+ &:hover{
364
+
365
+ background-color:#d84940;
366
+
367
+ }
368
+
369
+ }
370
+
371
+ .recruitment-third{
372
+
373
+ color:rgb(255, 255, 255);
374
+
375
+ font-size:20px;
376
+
377
+ text-align: center;
378
+
379
+ letter-spacing: 2.4px;
380
+
381
+ margin-top:67px;
382
+
383
+ font-weight: 600;
384
+
385
+ }
386
+
387
+ span{
388
+
389
+ margin-left:8px;
390
+
391
+ margin-right:8px;
392
+
393
+ }
394
+
395
+ .recruitment-forth{
396
+
397
+ color:rgb(255, 255, 255);
398
+
399
+ font-size:20px;
400
+
401
+ text-align: center;
402
+
403
+ letter-spacing: 2.4px;
404
+
405
+ margin-top:35px;
406
+
407
+ font-weight: 600;
408
+
409
+ }
410
+
411
+ .recruitment-fifth{
412
+
413
+ color:rgb(255, 255, 255);
414
+
415
+ font-size:20px;
416
+
417
+ text-align: center;
418
+
419
+ letter-spacing: 2.4px;
420
+
421
+ margin-top:35px;
422
+
423
+ font-weight: 600;
424
+
425
+ }
426
+
427
+ .buttons{
428
+
429
+ margin-top:25px;
430
+
431
+ text-align: center;
432
+
433
+ .twitter-share-button{
434
+
435
+ display: inline-block;
436
+
437
+
438
+
439
+ }
440
+
441
+ .fb-like{
442
+
443
+ vertical-align: bottom;
444
+
445
+ margin-bottom:5.5px;
446
+
447
+ }
448
+
449
+ }
450
+
451
+ }
452
+
453
+ .how-to{
454
+
455
+ height:586px;
456
+
457
+ background-image:url("https://isara.life/wp-content/themes/isara_v2/img/introbottom.jpg");
192
458
 
193
459
  background-size:cover;
194
460
 
195
461
  background-position: center center;
196
462
 
197
- .title-text{
198
-
199
- padding-top:88px;
200
-
201
- h2{
202
-
203
- color:#333333;
204
-
205
- line-height: 54px;
206
-
207
- font-size:28px;
208
-
209
- font-weight:600;
210
-
211
- letter-spacing: 1.5px;
212
-
213
- text-align: center;
214
-
215
- }
463
+ }
216
-
217
- img{
464
+
218
-
219
- display:block;
465
+ .about{
220
-
466
+
221
- height:111px;
467
+ height:555px;
222
-
223
- margin-top:5px;
468
+
224
-
225
- margin-left: auto;
226
-
227
- margin-right:auto;
228
-
229
- }
230
-
231
- h3{
232
-
233
- text-align:center;
234
-
235
- color:#333333;
236
-
237
- letter-spacing: 1.5px;
238
-
239
- margin-top:40px;
240
-
241
- font-size:20px;
242
-
243
- line-height: 22px;
244
-
245
- }
246
-
247
- }
248
-
249
- }
250
-
251
- .recruitment{
252
-
253
- height:600px;
254
-
255
- background-color:#ebb94d;
469
+ background-color:#fef5e0;
256
-
257
- .first{
258
-
259
- color:#ffffff;
260
-
261
- text-align: center;
262
-
263
- letter-spacing: 1.5px;
264
-
265
- line-height: 32px;
266
-
267
- padding-top:30px;
268
-
269
- font-size:20px;
270
-
271
- }
272
470
 
273
471
  }
274
472
 

3

画像の追加

2020/02/10 04:56

投稿

reo_fukkase
reo_fukkase

スコア50

test CHANGED
File without changes
test CHANGED
@@ -275,3 +275,7 @@
275
275
  ```
276
276
 
277
277
  ![イメージ説明](48c531d258e7d91a664be9ef9bf7385c.png)
278
+
279
+ ![イメージ説明](eddfc8ed67b2c9c89c1b1b0d2387c7eb.png)
280
+
281
+ ![イメージ説明](d499a9b88ae3fbea5a72b0051e5623db.png)

2

画像の添付

2020/02/10 04:02

投稿

reo_fukkase
reo_fukkase

スコア50

test CHANGED
File without changes
test CHANGED
@@ -273,3 +273,5 @@
273
273
  }
274
274
 
275
275
  ```
276
+
277
+ ![イメージ説明](48c531d258e7d91a664be9ef9bf7385c.png)

1

文の修正

2020/02/09 13:35

投稿

reo_fukkase
reo_fukkase

スコア50

test CHANGED
File without changes
test CHANGED
@@ -1,4 +1,4 @@
1
- bodyのfont-familyを指定しましたが、変わりません。
1
+ bodyのfont-familyを指定しましたが、変わりません。Macを使っています。
2
2
 
3
3
  ```html
4
4