红枫 发表于 2021-8-26 10:39

195400 发表于 2021-8-26 09:32
其实没多大必要写那些适应不同浏览器的代码，除极少的语句外用通用的就够了。
css里不为body设置就能在 ...

是的，css渐变代码设置于最外层div域上就行。

195400 发表于 2021-8-26 17:01


<div style="width:413px; height:415px;position:relative;overflow:hidden;
background-image: linear-gradient(to right bottom, #dbb 0%, #dbd 40%, #bbd 75%);">

<div style="width:200px;height200px;overflow:hidden;transform: rotate(120deg);position:absolute; top:-70px;left:0px;">
<div style="width:200px;height200px;overflow:hidden;transform: rotate(-60deg);">
<div style="width:200px;height:377px; background-image: url(https://z3.ax1x.com/2021/08/24/hkRKwF.gif) ;
background-size:125% auto; background-repeat:no-repeat;background-position:50% center;transform: rotate(-60deg);">
</div>
</div></div>


<div style="width:200px;height200px;overflow:hidden;transform: rotate(120deg);position:absolute; top:-70px;left:210px; ">
<div style="width:200px;height200px;overflow:hidden;transform: rotate(-60deg);">
<div style="width:200px; height:377px;background-image: url(https://z3.ax1x.com/2021/08/24/hkRmLT.gif) ;
background-size:125% auto; background-repeat:no-repeat;background-position:50% center;transform: rotate(-60deg);">
</div>
</div></div>


<div style="width:200px;height200px;overflow:hidden;transform: rotate(120deg);position:absolute; top:110px;left:105px;">
<div style="width:200px;height200px;overflow:hidden;transform: rotate(-60deg);">
<div style="width:200px; height:377px;background-image: url(https://z3.ax1x.com/2021/08/24/hkR1Y9.gif) ;
background-size:125% auto; background-repeat:no-repeat;background-position:50% center;transform: rotate(-60deg);">
</div>
</div></div>

</div>

红枫 发表于 2021-8-26 18:02

195400 发表于 2021-8-26 17:01


谢谢您的临帖指导！

195400 发表于 2021-8-26 18:06

红枫 发表于 2021-8-26 18:02
谢谢您的临帖指导！

向你学习新玩法:lol

寒冬残荷 发表于 2021-8-26 19:13


<div style="width:100%;height:350px; margin : 0px auto; padding-top :50px; text-align:center; line-height:180%; position : relative; ">
<span style="-webkit-background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke: 1px rgb(255,0,0);background-image:url(https://z3.ax1x.com/2021/07/10/WSvNo4.gif);        line-height:180%;font:bold 5em 仿宋体">精美佳作，大赞！
</span></div>
页: 1 [2]
查看完整版本: 代码音画---《怨锁深宫》---(鼠标遇凤凰播放音乐）