gpt4 book ai didi

html - 使用 css 创建自定义箭头形状

转载 作者:技术小花猫 更新时间:2023-10-29 11:48:39 25 4
gpt4 key购买 nike

<分区>

我有一个覆盖图像 slider 的 css 箭头框,但我需要使尾部缩进和透明,以便在它后面看到图像。需要白色部分是透明的。请参阅下面的附图和我的 CSS。谢谢。 css arrow box over image

#flag { 
width: 400px; height: 80px; background: #231f20; position: relative;
}

#flag:before {
content: "";
position: absolute;
top: 0;

width: 0;
height: 0;
border-top: 40px solid transparent;

border-bottom: 40px solid transparent;

border-left: 35px solid white;

}

#flag:after {
content: "";
position: absolute;
left: 400px;
bottom: 0;
width: 0;
height: 0;
border-top: 40px solid transparent;

border-bottom: 40px solid transparent;

border-left: 45px solid #231f20;

}

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com