質問編集履歴

1

テキストでのコード表示

2022/11/21 07:56

投稿

Taitaka
Taitaka

スコア0

test CHANGED
File without changes
test CHANGED
@@ -9,7 +9,86 @@
9
9
 
10
10
 
11
11
 
12
- ![[イメージ説明](![url](https://ddjkaamml8q8x.cloudfront.net/questions/2022-11-21/2b178459-3a7f-4318-97fd-c302b2af5d28.png))](https://ddjkaamml8q8x.cloudfront.net/questions/2022-11-21/aa99e5d4-8a18-4471-ad68-c423b71f335a.png)
12
+ ```index.html
13
+ <!DOCTYPE html>
14
+ <html lang="en">
15
+
16
+ <head>
17
+ <meta charset="UTF-8">
18
+ <link rel="stylesheet" href="style.css">
19
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
20
+ <meta name="viewport" content="width=
21
+ , initial-scale=1.0">
22
+ <title>シルエット</title>
23
+ </head>
24
+
25
+ <body>
26
+ <div class="header">
27
+ <h1>
28
+  <img src="https://onl.sc/bZskhdc" height="100">
29
+ </h1>
30
+
31
+ <nav class="my-parts">
32
+
33
+ <ul>
34
+
35
+ <li><a href="#">ホーム<span>HOME</span></a></li>
36
+
37
+ <li><a href="#">お知らせ<span>NEWS</span></a></li>
38
+
39
+ <li><a href="#">ブログ<span>BLOG</span></a></li>
40
+ <li><a href="#">概要<span>ABOUT</span></a></li>
41
+
42
+ <li><a href="#">お問い合わせ<span>CONTACT</span></a></li>
43
+
44
+ </ul>
45
+ </nav>
13
46
 
14
47
 
48
+ </div>
49
+
50
+ </body>
51
+
52
+ </html>```
53
+
54
+
55
+ ```
56
+ ``` style.css
57
+ .header h1{
58
+ color: purple;
59
+ font-size: 50px;
60
+
61
+ }
62
+
63
+ .my-parts ul {
64
+ list-style: none;
65
+ margin: 0;
66
+ padding: 0;
67
+
68
+ }
69
+ .my-parts ul::after {
15
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-11-21/2d529d63-009f-4b16-bed1-9ab250f2bf50.png)
70
+ content: "";
71
+ display: block;
72
+ clear: both;
73
+ }
74
+ .my-parts ul li {
75
+ float: left;
76
+ width: 20%;
77
+ box-sizing: border-box;
78
+ }
79
+ .my-parts ul li a {
80
+ display: block;
81
+ padding: .4em .8em;
82
+ text-decoration: none;
83
+ color: #333;
84
+ background: #fff;
85
+ text-align: center;
86
+ }
87
+ .my-parts ul li a:hover {
88
+ background: #eee;
89
+ }
90
+ .my-parts ul li span {
91
+ display: block;
92
+ font-size: .75em;
93
+ }
94
+ ```