Я ищу способ, чтобы сделать что-то вроде этого:Прозрачная граница на DIV с родительского DIV
во-первых, я, хотя о прозрачных границах, но это не будет работать, как есть родитель div (синий фон).
Цель состоит в том, чтобы установить прозрачную границу + родительский div вокруг дочернего элемента прозрачным, чтобы мы могли видеть фоновое изображение как границу.
Может ли кто-нибудь дать мне совет? Спасибо!
вы можете попробовать эту Css
div{width:300px;border:solid 1px red; background:blue;
padding-left:20px;}
ul {list-style-type:none;margin:0; padding:0;}
ul li{background:url('https://www.gravatar.com/avatar/76e03db06bb6dcf24f95bf4d354486db?s=64&d=identicon&r=PG') repeat 0 0;
margin:10px 0; padding:15px 10px; color:red; position:relative;z-index: 2;
}
ul li:after{
content: "";
position: absolute;
left: 5px;
top: 5px;
bottom: 5px;
right: 0px;
background: rgba(0,0,0,0.4);
z-index: -1;
}<div>
<ul>
<li>Hello Hello </li>
<li>Hello Hello </li>
<li>Hello Hello </li>
<li>Hello Hello </li>
<li>Hello Hello </li>
</ul>
</div>
я думаю, что вам придется разделить синий DIV и оберните их вокруг точек меню. В этом случае вы можете использовать margin вместо границы. я не думаю, что его можно сделать что-то прозрачным через 2 слоя. – Aytee
Да, хотя я кое о чем другом: создаю синий фон с прозрачными футлярами, которые будут обертывать кнопки списка. спасибо в любом случае за отзыв – Sentynel