回答編集履歴
1
コード追記
answer
CHANGED
|
@@ -37,4 +37,26 @@
|
|
|
37
37
|
a:last-child .pc_menu_cel::before{
|
|
38
38
|
border-right: none;
|
|
39
39
|
}
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
---
|
|
43
|
+
**別案**
|
|
44
|
+
|
|
45
|
+
疑似要素 before を使わずに、a要素を直接 transform で傾ける。
|
|
46
|
+
中のテキストも傾いてしまうので、逆に傾けて打ち消す。
|
|
47
|
+
|
|
48
|
+
```css
|
|
49
|
+
.pc_menu_box a {
|
|
50
|
+
transform: skewX(-8deg);
|
|
51
|
+
border-right: 2px solid #FFF;
|
|
52
|
+
}
|
|
53
|
+
.pc_menu_cel {
|
|
54
|
+
transform: skewX(8deg);
|
|
55
|
+
}
|
|
56
|
+
.pc_menu_box a:hover{
|
|
57
|
+
background: url(lib/images/menu_bg00_1_on.png) repeat-x;
|
|
58
|
+
}
|
|
59
|
+
.pc_menu_box a:last-child {
|
|
60
|
+
border-right: none;
|
|
61
|
+
}
|
|
40
62
|
```
|