11

そのため、オンラインでいくつかの異なる方法を試して頭を壁にぶつけてきましたが、何も機能しません。

幅がdiv流動的である必要があり、高さも可変である必要があります。

div は、タイル可能な背景画像の上にあります。その1px border周りには があります。

一枚の紙のように折りたたむには、div の右下が必要です。

一番下に固定されたdivで画像を使用してみました。しかし、それには、私が知る限り、幅または高さを固定する必要があります。

この方法を試しましたが、無地の背景色が必要です。繰り返すイメージがあります。

グラデーションを使用して隅の不透明度を制御するこの方法を試しましたが、これはほとんど機能しますが、私の div には境界線が必要です。境界線を適用すると効果が損なわれます。

background:
    linear-gradient(45deg,  rgba(255,0,0,0.4), rgba(255,0,0,0.4)),
    linear-gradient(135deg, rgba(255,0,0,0.4), rgba(255,0,0,0.4)),
    linear-gradient(225deg, transparent 10px,  rgba(255,0,0,0.4)
background-size: 14px 14px, 50% 100%, 50% 50%, 50% 50%;
background-position: 100% 0, 0 0, 100% 100%, 100% 0;
background-repeat: no-repeat;

//then an :after pseudo class to create the corner fold

どんな助けでも大歓迎です。ありがとう。

4

1 に答える 1