回答編集履歴

1

余分なテキストの削除

2021/02/18 11:17

投稿

MsParrot
MsParrot

スコア4

test CHANGED
@@ -1,8 +1,6 @@
1
- 1.HTMLの記述順入れ替え
1
+ 1.CSSで#top-bannerposition:fixed;にす
2
2
 
3
- 2.#top-bannerをposition:fixed;にする
4
-
5
- 3.jQueryで画面を600px以上スクロールダウンしたときにCSSのdisplayをnoneからflexに切り替える
3
+ 2.jQueryで画面を600px以上スクロールダウンしたときにCSSのdisplayをnoneからflexに切り替える
6
4
 
7
5
 
8
6
 
@@ -16,6 +14,20 @@
16
14
 
17
15
  ```HTML
18
16
 
17
+
18
+
19
+ <div class="top-logo">
20
+
21
+ <a href="#">
22
+
23
+ <svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" style="display:block;height:36px;width:36px;fill:#210034" aria-label="Airbnb" role="img" focusable="false"><path d="m16.5(以下省略)"></path></svg>
24
+
25
+ </a>
26
+
27
+ </div>
28
+
29
+
30
+
19
31
  <div id="top-banner">
20
32
 
21
33
  <a href="#">
@@ -28,17 +40,7 @@
28
40
 
29
41
  </div>
30
42
 
31
-
32
43
 
33
- <div class="top-logo">
34
-
35
- <a href="#">
36
-
37
- <svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" style="display:block;height:36px;width:36px;fill:#210034" aria-label="Airbnb" role="img" focusable="false"><path d="m16.5(以下省略)"></path></svg>
38
-
39
- </a>
40
-
41
- </div>
42
44
 
43
45
 
44
46
 
@@ -59,6 +61,20 @@
59
61
  }
60
62
 
61
63
 
64
+
65
+ .top-logo {
66
+
67
+ position: top;
68
+
69
+ background-color:#F2ECE2;
70
+
71
+ padding: 24px 0px 0px 24px;
72
+
73
+ width: 100vw;
74
+
75
+ margin: 0 auto;
76
+
77
+ }
62
78
 
63
79
 
64
80
 
@@ -81,22 +97,6 @@
81
97
  display: none;
82
98
 
83
99
  justify-content: space-between;
84
-
85
- }
86
-
87
-
88
-
89
- .top-logo {
90
-
91
- position: top;
92
-
93
- background-color:#F2ECE2;
94
-
95
- padding: 24px 0px 0px 24px;
96
-
97
- width: 100vw;
98
-
99
- margin: 0 auto;
100
100
 
101
101
  }
102
102