質問編集履歴

1

ソースコードを入れました

2020/08/15 09:46

投稿

braymki720
braymki720

スコア1

test CHANGED
File without changes
test CHANGED
@@ -24,6 +24,150 @@
24
24
 
25
25
 
26
26
 
27
+ HTML
28
+
29
+ <!DOCTYPE html>
30
+
31
+ <html lang="ja">
32
+
33
+ <head>
34
+
35
+ <meta charset="utf-8">
36
+
37
+ <title>WCB Cafe</title>
38
+
39
+ <meta name="description" content="ブレンドコーヒーとヘルシーなオーガニックフードを提供するカフェ">
40
+
41
+ <!--CSS-->
42
+
43
+ <link rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css">
44
+
45
+ <link href="https://fonts.googleapis.com/css?family=Philosopher" rel="stylesheet">
46
+
47
+ <link href="css/style.css" rel="stylesheet">
48
+
49
+ </head>
50
+
51
+ <body>
52
+
53
+ <header class="page-header">
54
+
55
+ <h1><a href="index.html"><img class="logo" src="images/logo.svg" alt="WCBカフェホーム"></a></h1>
56
+
57
+ <nav>
58
+
59
+ <ul class=”main-nav”>
60
+
61
+ <li><a href="news.html">News</a></li>
62
+
63
+ <li><a href="menu.html">Nenu</a></li>
64
+
65
+ <li><a href="contact.html">Contact</a></li>
66
+
67
+ </ul>
68
+
69
+ </nav>
70
+
71
+ </header>
72
+
73
+ </body>
74
+
75
+ </html>
76
+
77
+
78
+
79
+
80
+
81
+
82
+
83
+ CSS
84
+
85
+ @charset "UTF-8";
86
+
87
+ /*共通部分*/
88
+
89
+ html{
90
+
91
+ font-size:100%;
92
+
93
+ }
94
+
95
+ body{
96
+
97
+ font-family:"Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","ヒラギノ角ゴ Pro W3",sans-serif;
98
+
99
+ line-height:1.7;
100
+
101
+ color:#432;        ←ここです!!!
102
+
103
+ }
104
+
105
+ a{
106
+
107
+ text-decoration:none;
108
+
109
+ }
110
+
111
+ img{
112
+
113
+ max-width:100%;
114
+
115
+ }
116
+
117
+ /*HEADER*/
118
+
119
+ .logo{
120
+
121
+ width:210px;
122
+
123
+ margin-top:14px;
124
+
125
+ }
126
+
127
+ .main-nav {
128
+
129
+ display: flex;
130
+
131
+ font-size: 1.25rem;
132
+
133
+ text-transform: uppercase;
134
+
135
+ margin-top: 34px;
136
+
137
+ list-style: none;
138
+
139
+ }
140
+
141
+ .main-nav li {
142
+
143
+ margin-left: 36px;
144
+
145
+ }
146
+
147
+ .main-nav a {
148
+
149
+ color:#432;       ←ここです!!!
150
+
151
+ } 
152
+
153
+ .main-nav a:hover {
154
+
155
+ color:#0bd;        ←ここです!!!
156
+
157
+ }
158
+
159
+ .page-header{
160
+
161
+ display: flex;
162
+
163
+ justify-content: space-between;
164
+
165
+ }
166
+
167
+
168
+
169
+
170
+
27
171
 
28
172
 
29
173
  ```![イメージ説明](b0bc85e2b2cf03a41762245a912ddfbb.png)[![イメージ説明](60e132aafcf3be44966da5ef0f93c1a7.png)]