質問編集履歴

4

ヘッダーに問題のある画面のスクリーンショットを添付いたしました。

2018/05/24 09:29

投稿

punchan36
punchan36

スコア105

test CHANGED
File without changes
test CHANGED
File without changes

3

コードをコードブロックで囲みました。

2018/05/24 09:29

投稿

punchan36
punchan36

スコア105

test CHANGED
File without changes
test CHANGED
@@ -16,7 +16,9 @@
16
16
 
17
17
  ### 該当のソースコード
18
18
 
19
+
20
+
19
- HTML
21
+ ```HTML
20
22
 
21
23
  <header>
22
24
 
@@ -46,9 +48,11 @@
46
48
 
47
49
  </header>
48
50
 
51
+ ```
49
52
 
50
53
 
54
+
51
- CSS
55
+ ```CSS
52
56
 
53
57
  header {
54
58
 
@@ -90,6 +94,8 @@
90
94
 
91
95
  }
92
96
 
97
+ ```
98
+
93
99
 
94
100
 
95
101
  ### 試したこと

2

HTMLも追記致しました。

2018/05/24 09:21

投稿

punchan36
punchan36

スコア105

test CHANGED
File without changes
test CHANGED
@@ -16,7 +16,39 @@
16
16
 
17
17
  ### 該当のソースコード
18
18
 
19
+ 【HTML】
19
20
 
21
+ <header>
22
+
23
+ <div class="container">
24
+
25
+ <div class="header-left">
26
+
27
+ <h1 class="title">Bangkok Health Massage</h1>
28
+
29
+ </div>
30
+
31
+ <div class="header-right">
32
+
33
+ <a href="#" style="text-decoration: none;">Top</a>
34
+
35
+ <a href="#" style="text-decoration: none;">Flow</a>
36
+
37
+ <a href="#" style="text-decoration: none;">Company</a>
38
+
39
+ <a href="#" style="text-decoration: none;">Contact</a>
40
+
41
+ <a href="#" class="btn faceook"><i class="fab fa-facebook-square"></i></a>
42
+
43
+ </div>
44
+
45
+ </div>
46
+
47
+ </header>
48
+
49
+
50
+
51
+ 【CSS】
20
52
 
21
53
  header {
22
54
 

1

ソースコードを追記いたしました。初心者でかなり未熟ですが宜しくお願い致します。

2018/05/24 09:07

投稿

punchan36
punchan36

スコア105

test CHANGED
File without changes
test CHANGED
@@ -18,6 +18,48 @@
18
18
 
19
19
 
20
20
 
21
+ header {
22
+
23
+ position: fixed;
24
+
25
+ top: 0px;
26
+
27
+ background-color: rgba(255,255,255,0.6);
28
+
29
+ height: 70px;
30
+
31
+ z-index: 10;
32
+
33
+ }
34
+
35
+
36
+
37
+ .header-left {
38
+
39
+ float: left;
40
+
41
+ right: 0;
42
+
43
+ }
44
+
45
+
46
+
47
+ .header-right {
48
+
49
+ float: right;
50
+
51
+ left: 0;
52
+
53
+ line-height: 70px;
54
+
55
+ font-size: 20px;
56
+
57
+ text-shadow: 1.5px 0.5px 0.5px #000000;
58
+
59
+ }
60
+
61
+
62
+
21
63
  ### 試したこと
22
64
 
23
65