东篱闲人 发表于 2024-6-5 17:59

【测试代码】茶然亭

本帖最后由 东篱闲人 于 2024-6-5 18:50 编辑 <br /><br /><style>
#oblk        {
--w:1280px;--h:854px;
        width:var(--w);
        height:calc(var(--h));
        overflow:hidden;
        border-radius:24px;
        box-shadow:4px 4px 10px black;
        position:relative;
        margin:80px 0 32px calc(50% - 0.5 * var(--w) - 80px);
       
        #pichold        {
                width:calc(6 * var(--w));
                position:absolute;
                left:0px;left:0px;
                z-index:10;
                animation: mleft 60s steps(6) infinite;
               
                & img        {width:var(--w);height:var(--h);float:left;}
        }
}       
@keyframes        mleft        {to {left:calc(-6 * var(--w));}}
</style>
<div id="oblk">
        <div id="pichold">
                <img src="https://pic.imgdb.cn/item/666031595e6d1bfa05952649.jpg"/>
                <img src="https://pic.imgdb.cn/item/6660319d5e6d1bfa05956903.jpg"/>
                <img src="https://pic.imgdb.cn/item/666032125e6d1bfa0595f0a7.jpg"/>
                <img src="https://pic.imgdb.cn/item/6660322b5e6d1bfa059604e5.jpg"/>
                <img src="https://pic.imgdb.cn/item/666032465e6d1bfa05961d63.jpg"/>
                <img src="https://pic.imgdb.cn/item/666032755e6d1bfa05964979.jpg"/>
               
        </div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1894277763" loop autoplay></audio>

东篱闲人 发表于 2024-6-5 18:02

测试起个网名好难《高考》代码。。。。

东篱闲人 发表于 2024-6-5 18:07

不居中？{:5_115:}

起个网名好难 发表于 2024-6-5 18:11

很美！
https://img.soogif.com/olrt53z1tMMdY6VqE2K7nSCkMRVWeFe0.gif

起个网名好难 发表于 2024-6-5 18:16

东篱闲人 发表于 2024-6-5 18:07
不居中？

margin: auto;
换成
        margin:80px 0 32px calc(50% - 0.5 * var(--w) - 80px);

东篱闲人 发表于 2024-6-5 18:51

起个网名好难 发表于 2024-6-5 18:16
margin: auto;
换成
        margin:80px 0 32px calc(50% - 0.5 * var(--w) - 80px);

你真帅！{:5_116:}{:4_204:}

红影 发表于 2024-6-5 19:09

这个漂亮，跟着这个名称去搜了一下，果真看到了这个系列组图呢。{:4_204:}

青山悠然，一亭茶香。茶僧皎然的诗歌“九日山僧院，东篱菊也黄，俗人多泛酒，谁解助茶香？”

小辣椒 发表于 2024-6-5 20:44

我手机点击了再点击，没有反应，找不到按钮

小辣椒 发表于 2024-6-5 20:45

图图意境很美{:4_199:}

东篱闲人 发表于 2024-6-5 20:47

小辣椒 发表于 2024-6-5 20:44
我手机点击了再点击，没有反应，找不到按钮

这个没按钮，师傅是按习惯了。。。{:5_106:}

小辣椒 发表于 2024-6-5 20:50

看见老公图片自动转换效果了，不用鼠标点击的，赞哦{:4_178:}

东篱闲人 发表于 2024-6-5 22:23

小辣椒 发表于 2024-6-5 20:50
看见老公图片自动转换效果了，不用鼠标点击的，赞哦

师傅这么客气吗？{:5_117:}

马黑黑 发表于 2024-6-5 22:55

{:4_199:}

樵歌 发表于 2024-6-6 07:55

是一组画，怎么找到的。

梦油 发表于 2024-6-6 09:05

很有特色的制作{:5_116:}

东篱闲人 发表于 2024-6-6 09:23

樵歌 发表于 2024-6-6 07:55
是一组画，怎么找到的。

百度。

东篱闲人 发表于 2024-6-6 09:23

梦油 发表于 2024-6-6 09:05
很有特色的制作

老梦喝茶。。。{:4_190:}

梦油 发表于 2024-6-6 16:49

东篱闲人 发表于 2024-6-6 09:23
老梦喝茶。。。

东篱朋友别客气。

绿叶清舟 发表于 2024-6-6 20:26

俺这里为啥不会动的呢

樵歌 发表于 2024-6-7 06:55

东篱闲人 发表于 2024-6-6 09:23
百度。

百度是你家表妹开的吧。{:4_173:}
页: [1]
查看完整版本: 【测试代码】茶然亭