回答編集履歴

1

簡単な解説の追加

2018/08/21 04:19

投稿

5o5o_wagon
5o5o_wagon

スコア214

test CHANGED
@@ -2,10 +2,44 @@
2
2
 
3
3
  .nav > div {
4
4
 
5
- border:20px solid #000;
5
+ border:solid 20px #000;
6
6
 
7
7
  }
8
8
 
9
9
  ```
10
10
 
11
11
  で効くはずです。
12
+
13
+
14
+
15
+ ## 簡単な解説
16
+
17
+
18
+
19
+ 以下でも書かれていますが、`border`プロパティは、ボーダーのスタイル・太さ・色をまとめて指定する際に使用します。
20
+
21
+ [border …… ボーダーのスタイル・太さ・色を指定する](http://www.htmq.com/style/border.shtml)
22
+
23
+
24
+
25
+ なので、上のCSSを分解すると以下のようになります。
26
+
27
+ ```css
28
+
29
+ .nav > div {
30
+
31
+ border-style: solid; //1本線を表示
32
+
33
+ border-width: 20px; //線幅を20pxに
34
+
35
+ border-color: #000; //線色を黒に
36
+
37
+ }
38
+
39
+ ```
40
+
41
+ 質問者さんは`border-style`を指定していなかったので線がでなかったのだと思います。
42
+
43
+
44
+
45
+ ※ それとコード見てみたところ、全角スペースが入っている部分があったのでご注意ください(うまく動作しない原因になります)