Используйте CSS для создания пользовательской формы стрелки [дубликат]
На этот вопрос уже есть ответ здесь:
Стрелка до и после рамки с CSS 1 ответУ меня есть поле со стрелкой css, перекрывающее слайдер изображения, но мне нужно сделать хвост с отступом и прозрачным, чтобы за ним было видно изображение. Нужно, чтобы белая порция была прозрачной. Смотрите прикрепленное изображение и мой CSS ниже. Благодарю.
#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;
}