花潮论坛

搜索
热搜: 活动 交友 discuz
查看: 116|回复: 77

华墟

[复制链接]
  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

    发表于 2025-8-18 08:03 | 显示全部楼层 |阅读模式

    请马上登录,朋友们都在花潮里等着你哦:)

    您需要 登录 才可以下载或查看,没有账号?立即注册

    x

    评分

    参与人数 6威望 +220 金钱 +440 经验 +220 收起 理由
    小辣椒 + 50 + 100 + 50 赞一个!
    朵拉 + 30 + 60 + 30 赞一个!
    红影 + 50 + 100 + 50 赞一个!
    偶然~ + 30 + 60 + 30 很给力!
    花飞飞 + 30 + 60 + 30 很给力!
    杨帆 + 30 + 60 + 30 赞一个!

    查看全部评分

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 08:07 | 显示全部楼层
    <style> @import 'https://638183.freep.cn/638183/web/css/tz01.css'; #pa { --offsetX: 81px; --bg: #fff url('https://638183.freep.cn/638183/t24/w5/hxxu.webp') no-repeat center/cover; --per: 15px; --ma-size: 15%; mask: conic-gradient(red 0 25%, rgba(0,0,0,.95) 0) center / var(--per) var(--per); -webkit-mask: conic-gradient(red 0 25%, rgba(0,0,0,.95) 0) center / var(--per) var(--per); } #ma { background: orange radial-gradient(circle, darkred 70%, transparent 75%, transparent) 0 0 / 4% 4%; left: 5%; mask: url('https://638183.freep.cn/638183/small/fi1.webp') no-repeat center/cover; -webkit-mask: url('https://638183.freep.cn/638183/small/fi1.webp') no-repeat center/cover; } #btnFs { left: 20px; bottom: 20px; color: #eee; } </style> <div id="pa"> <audio id="aud" src="https://music.163.com/song/media/outer/url?id=1478143442" autoplay loop></audio> <video class="pd-vid" src="https://img.tukuppt.com/video_show/2414777/00/02/12/5b514d29ccc07.mp4" autoplay loop muted></video> <video class="qk-vid" src="https://bpic.588ku.com/video_listen/588ku_video/23/08/29/17/19/35/video64edb827bb149.mp4" autoplay loop muted></video> <div id="ma" class="grayscale"></div> </div> <script type="module"> import { FS } from 'https://638183.freep.cn/638183/web/js/fullscreen.js'; FS(pa, ma); var per = 15, step = 0.01, raf; aud.onplaying = aud.onpaused = () => aud.paused ? cancelAnimationFrame(raf) : animate(); aud.onseek = () => cancelAnimationFrame(raf); animate(); function animate() { if (document.visibilityState === 'hidden') return; cancelAnimationFrame(raf); per -= step; if (per> 15 || per < 1.5) step = -step; pa.style.setProperty('--per', `${per}px`); if (!aud.paused) raf = requestAnimationFrame(animate); } </script>

    评分

    参与人数 2威望 +80 金钱 +160 经验 +80 收起 理由
    红影 + 50 + 100 + 50 赞一个!
    花飞飞 + 30 + 60 + 30 很给力!

    查看全部评分

    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 08:15 | 显示全部楼层
    和昨天的幻灭一样,直接对帖子容器使用 mask 遮罩,box-shaodw 或 filter drop-shadow 的外阴影出不来。原理之前谈过,简单说就是阴影被遮挡掉了。
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 08:17 | 显示全部楼层
    需要保留阴影的话,可以考虑将在伪元素上实现遮罩:伪元素 ::before 负责渲染背景图片,对它进行遮罩处理;主元素背景为空。
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    奋斗
    2025-11-30 00:22
  • 签到天数: 380 天

    [LV.9]以坛为家II

    297

    主题

    2548

    回帖

    1万

    积分

    版主

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生鹰傲苍穹飞龙在天王者至尊大将风范花潮版主

    发表于 2025-8-18 08:50 | 显示全部楼层
    漂亮,谢谢马老师精彩分享
    ★青春是一个人的精神生命,奋斗是一个人最大的体面,学习是一个人最美的姿态。
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 09:47 | 显示全部楼层
    这个大背景上用了锥形渐变遮罩,--per: 15px;起始尺寸,
    mask: conic-gradient(red 0 25%, rgba(0,0,0,.95) 0) center / var(--per) var(--per);
    锥形只显示四分之一,看上去就是一个小点,并且宽高会同时变大或者变小,
    循环往复,背景看上去呈像素状。。
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 09:54 | 显示全部楼层
    小播是橙色底,用了径向渐变,强制为正圆,设置为宽高4%的小圆点。。。
    小圆点边缘还设了过渡,显得更加自然。。
    这个橙底红点的大背景,通过图案遮罩,就成为图案形状上加上小圆点的效果
    处处都是细节,设计太精巧啦
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 09:59 | 显示全部楼层
    背景用的是两层视频进行渲染,与小播色彩统一协调。。。
    音乐鼓点密集,激昂振奋,描绘一场宏大的战争场面。。
    这是周一上班的节奏啊。。
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 10:01 | 显示全部楼层
    马黑黑 发表于 2025-8-18 08:17
    需要保留阴影的话,可以考虑将在伪元素上实现遮罩:伪元素 ::before 负责渲染背景图片,对它进行遮罩处理; ...

    两个不同的贴子对比,看到阴影效果了,
    伪元素遮罩不影响背景阴影设置的吧。
    直接在背景遮罩会影响
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    开心
    2025-11-29 23:17
  • 签到天数: 75 天

    [LV.6]常住居民II

    588

    主题

    2万

    回帖

    7万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生奔放热烈缤纷心情鹰傲苍穹飞龙在天王者至尊大将风范天籁妙音妙笔生花麦霸歌神共看流星侠骨柔肠心想事成开朗大方花潮管理

    QQ
    发表于 2025-8-18 10:56 | 显示全部楼层
    制作大气
    如果信命,所有的偶然都是注定!
    如果不信,所有的注定都是偶然!
    回复

    使用道具 举报

  • TA的每日心情
    开心
    2025-11-29 23:17
  • 签到天数: 75 天

    [LV.6]常住居民II

    588

    主题

    2万

    回帖

    7万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生奔放热烈缤纷心情鹰傲苍穹飞龙在天王者至尊大将风范天籁妙音妙笔生花麦霸歌神共看流星侠骨柔肠心想事成开朗大方花潮管理

    QQ
    发表于 2025-8-18 10:56 | 显示全部楼层
    音乐唯美
    如果信命,所有的偶然都是注定!
    如果不信,所有的注定都是偶然!
    回复

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 12:42 | 显示全部楼层

    感谢支持
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 12:42 | 显示全部楼层
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 12:42 | 显示全部楼层
    杨帆 发表于 2025-8-18 08:50
    漂亮,谢谢马老师精彩分享

    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 12:43 | 显示全部楼层
    花飞飞 发表于 2025-8-18 09:47
    这个大背景上用了锥形渐变遮罩,--per: 15px;起始尺寸,
    mask: conic-gradient(red 0 25%, rgba(0,0,0,.95 ...

    解读准确
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 12:43 | 显示全部楼层
    花飞飞 发表于 2025-8-18 09:54
    小播是橙色底,用了径向渐变,强制为正圆,设置为宽高4%的小圆点。。。
    小圆点边缘还设了过渡,显得更加自 ...

    理解正确
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-11-30 07:45
  • 签到天数: 1655 天

    [LV.Master]伴坛终老

    3024

    主题

    13万

    回帖

    28万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9Rank: 9

    花潮帅哥鼠牛虎兔龙蛇马羊猴鸡狗猪多彩人生星月交辉奔放热烈海样胸怀春风拂面火热情怀优雅迷人神秘浪漫相遇之美鹰傲苍穹花好月圆紫色情节飞龙在天王者至尊大将风范音画大师天籁妙音共看流星风雨同行我心永远幸福快乐喜乐安康侠骨柔肠心想事成开朗大方花潮管理

     楼主| 发表于 2025-8-18 12:44 | 显示全部楼层
    花飞飞 发表于 2025-8-18 10:01
    两个不同的贴子对比,看到阴影效果了,
    伪元素遮罩不影响背景阴影设置的吧。
    直接在背景遮罩会影响{:4_ ...

    嗯,这是阴影被遮罩了
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 17:54 | 显示全部楼层

    貌似之前贴子里有出现过的,这复习比新课接收快一丢丢
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 17:55 | 显示全部楼层

    理解万岁,万一理解错了更麻烦
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2025-8-5 16:33
  • 签到天数: 44 天

    [LV.5]常住居民I

    62

    主题

    1万

    回帖

    2万

    积分

    贵宾

    Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7Rank: 7

    花潮美女流光溢彩优雅神秘花潮贵宾

    发表于 2025-8-18 17:55 | 显示全部楼层
    马黑黑 发表于 2025-8-18 12:44
    嗯,这是阴影被遮罩了

    对比一下看得更明显
    回复 支持 反对

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    小黑屋|手机版|Archiver|服务支持:DZ动力|huachaowang.com Inc. ( 蜀ICP备17032287号-1 )

    GMT+8, 2025-11-30 15:08 , Processed in 0.115968 second(s), 32 queries .

    Powered by Discuz! X3.4

    © 2001-2013 Comsenz Inc.

    快速回复 返回顶部 返回列表