回答編集履歴
1
コード追記
answer
CHANGED
|
@@ -8,4 +8,17 @@
|
|
|
8
8
|
clip-path: polygon(0 10vw, 100% 0, 100% calc(300px - 10vw), 0% 100%);
|
|
9
9
|
}
|
|
10
10
|
```
|
|
11
|
-
10vwの数値を変更することでお好みの角度にしてください。
|
|
11
|
+
10vwの数値を変更することでお好みの角度にしてください。
|
|
12
|
+
|
|
13
|
+
ひょっとするとこちらの方がご希望に近いかな。
|
|
14
|
+
|
|
15
|
+
```css
|
|
16
|
+
.bg {
|
|
17
|
+
width: 100%;
|
|
18
|
+
height: calc(300px + 10vw);
|
|
19
|
+
background: #5905f5;
|
|
20
|
+
clip-path: polygon(0 10vw, 100% 0, 100% 300px, 0% 100%);
|
|
21
|
+
}
|
|
22
|
+
```
|
|
23
|
+
前者はbgブロックの高さ固定、
|
|
24
|
+
後者は平行四辺形の縦の辺の高さ固定
|