41 lines
1.1 KiB
HTML
41 lines
1.1 KiB
HTML
<style>
|
|
.box { position: relative; width: 100px; height:100px; }
|
|
a { display: block; position: relative; width: 100px; height:100px; background-color: green; }
|
|
a:visited { background-color: red; }
|
|
.background { background-color: green; }
|
|
.multiply { mix-blend-mode: multiply; }
|
|
</style>
|
|
<div>
|
|
<div class="box background">
|
|
<a class="multiply"></a>
|
|
</div>
|
|
<div class="box background">
|
|
<a class="multiply" href=""></a>
|
|
</div>
|
|
<div class="box background">
|
|
<div class="box multiply">
|
|
<a></a>
|
|
</div>
|
|
</div>
|
|
<div class="box background">
|
|
<div class="box multiply">
|
|
<a href=""></a>
|
|
</div>
|
|
</div>
|
|
<div class="box background">
|
|
<div class="box add_multiply">
|
|
<a></a>
|
|
</div>
|
|
</div>
|
|
<div class="box background">
|
|
<div class="box add_multiply">
|
|
<a href=""></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
document.body.offsetLeft;
|
|
for (element of document.querySelectorAll(".add_multiply"))
|
|
element.classList.add("multiply");
|
|
</script>
|