我正在嘗試使用background-image: repeating-linear-gradient.
div {
--spac: 2em;
line-height: var(--spac);
color: white;
background-image: repeating-linear-gradient(red 0 var(--spac), green var(--spac) calc(var(--spac) * 2));
}<div>Stack Overflow is a question and answer website for professional and enthusiast programmers. It is the flagship site of the Stack Exchange Network,[4][5][6] created in 2008 by Jeff Atwood and Joel Spolsky.[7][8] It features questions and answers on a
wide range of topics in computer programming.[9][10][11] It was created to be a more open alternative to earlier question and answer websites such as Experts-Exchange. Stack Overflow was sold to Prosus, a Netherlands-based consumer internet conglomerate,
on 2 June 2021 for $1.8 billion.[12]</div>它作業正常，但我只是想知道是否有任何方法可以使沒有文本的 div 區域變得透明（使照片圈中的黑色區域變得透明）。
我能想到的另一個解決方案是split基于換行符的文本并使用for回圈為不同的行分配不同的顏色，但這太混亂了。
我認為background-image: repeating-linear-gradient，不會有一些簡單的解決方案，因為 background-image: repeating-linear-gradient根據元素的寬度而不是文本分配背景顏色。（如果有，請糾正我并告訴我！）
解決此問題的替代解決方案是什么？
uj5u.com熱心網友回復：
如果您準備好進行一些黑客攻擊，這里有一個。訣竅是讓白色覆寫該區域：
.box {
--spac: 2em;
line-height: var(--spac);
color: white;
background-image: repeating-linear-gradient(red 0 var(--spac), green var(--spac) calc(var(--spac) * 2));
overflow:hidden;
}
.box:after {
content:"";
display:inline-block;
vertical-align:top;
clip-path:inset(0 -100vmax -100vmax 0);
box-shadow:0 0 0 100vmax #fff;
}<div class="box">Stack Overflow is a question and answer website for professional and enthusiast programmers. It is the flagship site of the Stack Exchange Network,[4][5][6] created in 2008 by Jeff Atwood and Joel Spolsky.[7][8] It features questions and answers on a
wide range of topics in computer programming.[9][10][11] It was created to be a more open alternative to earlier question and answer websites such as Experts-Exchange. Stack Overflow was sold to Prosus, a Netherlands-based consumer internet conglomerate,
on 2 June 2021 for $1.8 billion.[12]</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/411154.html
標籤：
上一篇：CSS：無論如何都無法編輯鏈接