回答編集履歴

1

コードにコメントを追加・それにともなう回答文の編集

2019/07/09 16:36

投稿

take-t.t.
take-t.t.

スコア360

test CHANGED
@@ -1,8 +1,10 @@
1
1
  このような感じでどうでしょうか?
2
+
3
+ .menuのbackground-colorをコメントアウトしたり、.menu::afterのpositionの値を変えたりしてみると挙動が分かりやすいと思います。
2
4
 
3
5
 
4
6
 
5
- サンプル → [https://jsfiddle.net/gabky9z1/](https://jsfiddle.net/gabky9z1/)
7
+ サンプル → [https://jsfiddle.net/tu7wo8xp/](https://jsfiddle.net/tu7wo8xp/)
6
8
 
7
9
 
8
10
 
@@ -10,7 +12,7 @@
10
12
 
11
13
  <div class="menu">
12
14
 
13
- <p>text</p>
15
+ <p>イタリアンレストラン</p>
14
16
 
15
17
  </div>
16
18
 
@@ -42,7 +44,7 @@
42
44
 
43
45
  left: -5px;
44
46
 
45
- right: -5px; /* 線の太さの調整 */
47
+ right: -5px; /* (擬似的に)線の太さの調整 */
46
48
 
47
49
  background: repeating-linear-gradient(45deg, green, green 5px, white 5px, white 10px, red 10px, red 15px);
48
50