我正在嘗試添加一個黑色矩形作為紅色 div 的 bakcground。
我設法使水平硬褪色：
background: rgb(0,0,0);
background: linear-gradient(90deg, rgba(0,0,0,1) 60%, rgba(208,6,30,1) 60%);
它似乎是水平的或垂直的。我可以兩者都做嗎？
我想用 CSS 來做這件事，而不是添加黑色影像作為背景。
uj5u.com熱心網友回復：
如果將背景顏色設定為紅色，則可以用黑色矩形覆寫它，例如，寬度為 60%，高度為 50%，并且從底部定位。
div {
--r: rgba(208, 6, 30, 1);
--b: rgba(0, 0, 0, 1);
display: inline-block;
width: 50vmin;
height: 30vmin;
background-color: var(--r);
background-image: linear-gradient(var(--b), var(--b));
background-size: 60% 50%;
background-position: left bottom;
background-repeat: no-repeat;
}<div></div>uj5u.com熱心網友回復：
使用圓錐梯度：
.box {
display: inline-block;
width: 300px;
height: 200px;
background: conic-gradient(from -90deg at 70% 50%, rgb(208,6,30) 75%, black 0);
/* adjust the "at 70% 50%" to control the position */
}<div class="box"></div>uj5u.com熱心網友回復：
背景：RGB（0,0,0）；背景剪輯：內容框；
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/468652.html
上一篇：將滑鼠懸停在影像上以顯示文本框不起作用（html、css）
下一篇：帶有連字符的奇怪事物