<?xml version="1.0" encoding="gbk"?>
<rss version="2.0">
  <channel>
    <title>花潮论坛 - 马黑黑教程专版</title>
    <link>https://huachaowang.com/forum-94-1.html</link>
    <description>Latest 20 threads of 马黑黑教程专版</description>
    <copyright>Copyright(C) 花潮论坛</copyright>
    <generator>Discuz! Board by Comsenz Inc.</generator>
    <lastBuildDate>Sun, 20 Sep 2026 07:03:50 +0000</lastBuildDate>
    <ttl>60</ttl>
    <image>
      <url>https://huachaowang.com/static/image/common/logo_88_31.gif</url>
      <title>花潮论坛</title>
      <link>https://huachaowang.com/</link>
    </image>
    <item>
      <title>perspective属性和perspective函数</title>
      <link>https://huachaowang.com/thread-96534-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox blockquote { padding: 14px; border: solid gray; border-width: 0 4px; border-radius: 10px; background: #ddd; ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Thu, 17 Sep 2026 23:55:19 +0000</pubDate>
    </item>
    <item>
      <title>文本3d排版效果一例</title>
      <link>https://huachaowang.com/thread-96448-1-1.html</link>
      <description><![CDATA[&amp;lt;style&amp;gt;
    body {
        background: black;
        perspective: 1000px;
    }
    .pa {
        font: bold 3vw sans-serif;
        color: green;
        text-shadow:
            -2px -2px 2px lightgreen,
            2px 2px 2px dar ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Mon, 14 Sep 2026 23:37:35 +0000</pubDate>
    </item>
    <item>
      <title>css clip-path实现文本高亮动画</title>
      <link>https://huachaowang.com/thread-95982-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox blockquote { padding: 14px; border: solid gray; border-width: 0 4px; border-radius: 10px; background: #ddd; ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Fri, 28 Aug 2026 13:39:48 +0000</pubDate>
    </item>
    <item>
      <title>CSS mask 实现文本高亮动画</title>
      <link>https://huachaowang.com/thread-95937-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox blockquote { padding: 14px; border: solid gray; border-width: 0 4px; border-radius: 10px; background: #ddd; ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Thu, 27 Aug 2026 05:30:27 +0000</pubDate>
    </item>
    <item>
      <title>CSS高光游移文本效果</title>
      <link>https://huachaowang.com/thread-95910-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox blockquote { padding: 14px; border: solid gray; border-width: 0 4px; border-radius: 10px; background: #ddd; ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Wed, 26 Aug 2026 05:54:31 +0000</pubDate>
    </item>
    <item>
      <title>恭喜您中奖啦（纯CSS实现卡片正背两面翻转）</title>
      <link>https://huachaowang.com/thread-95858-1-1.html</link>
      <description><![CDATA[&amp;lt;style&amp;gt;
    /* body创建景深 ：800px */
    body {
        font-size: 2em;
        perspective: 800px;
    }
    /* 容器 ：提供3d场景 */
    .pa {
        width: 460px;
        height: 200px;
        transform-style: preserve-3d;
     ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Mon, 24 Aug 2026 04:39:40 +0000</pubDate>
    </item>
    <item>
      <title>CSS关键帧动画：运动对象绕柱子做圆周运动</title>
      <link>https://huachaowang.com/thread-95837-1-1.html</link>
      <description><![CDATA[&amp;lt;style&amp;gt;
     /* 一级容器 ：提供景深（基于Z轴）*/
     .pa {
         width: 1024px;
         height: 800px;
         border: thick double gray;
         perspective: 2000px; /* 景深 */
         margin: 20px auto 0;
         position: re ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Sun, 23 Aug 2026 13:03:26 +0000</pubDate>
    </item>
    <item>
      <title>支持血压监测的国产智能手表选购建议</title>
      <link>https://huachaowang.com/thread-95809-1-1.html</link>
      <description><![CDATA[.artBox { font: normal 18px/1.5 sans-serif; overflow: auto; position: relative; }
    .artBox p { margin: 10px 0; }
    .artBox blockquote { margin: 10px 20px; padding: 2px 15px; border-left: 3px solid skyblue; background: #e7e5e3; }
    .ar ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Sat, 22 Aug 2026 10:14:32 +0000</pubDate>
    </item>
    <item>
      <title>JS ?? 和 ||</title>
      <link>https://huachaowang.com/thread-95779-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 0 6px; background: rgba(0,100,100,0.35); }
    .artBox p { margin: 12px 0; }



    在 JavaScript，双问号 ?? 是空值合并运算符，双竖杠 || 是逻辑 ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Fri, 21 Aug 2026 04:50:12 +0000</pubDate>
    </item>
    <item>
      <title>遍历JS对象所有属性键</title>
      <link>https://huachaowang.com/thread-95712-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: rgba(0,80,20,.2); }
    .artBox p { margin: 10px 0; }



    JS对象有两种类型的属性键：字符串和符号。符号（symbol）是一个特 ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Wed, 19 Aug 2026 11:45:10 +0000</pubDate>
    </item>
    <item>
      <title>svgdr path+rotaes 指令绘制多叶草</title>
      <link>https://huachaowang.com/thread-95641-1-1.html</link>
      <description><![CDATA[@import \'https://638183.freep.cn/638183/web/css/hl.css\';
    .artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox p { margin: 10px 0; }
    .artBox pre { white-space: pre-wrap; tab-size: 4; }
    .artBox mark { back ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Mon, 17 Aug 2026 23:49:08 +0000</pubDate>
    </item>
    <item>
      <title>svgdr image 指令应用举例</title>
      <link>https://huachaowang.com/thread-95528-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox blockquote { padding: 14px; border: solid gray; border-width: 0 4px; border-radius: 10px; background: #ddd; ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Fri, 14 Aug 2026 09:38:44 +0000</pubDate>
    </item>
    <item>
      <title>生命线（改进版）</title>
      <link>https://huachaowang.com/thread-95474-1-1.html</link>
      <description><![CDATA[@import \'https://638183.freep.cn/638183/web/api/audioplayer.css\';
    .pa { --offsetX: 81px; --bg: url(\'https://638183.freep.cn/638183/t24/w8/space.webp\') no-repeat center/cover; color: orange; }
    .player { width: 480px; bottom: 10px; }
  ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Thu, 13 Aug 2026 00:38:13 +0000</pubDate>
    </item>
    <item>
      <title>SVG动态模拟示波图</title>
      <link>https://huachaowang.com/thread-95472-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox p { margin: 10px 0; }



    实现原理：JS 动态生成 SVG path 元素 d 属性值，由 setTimeout、setInterval 定时器或 requestAnimationFrame（请求关键帧动画）或其它机制 ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Thu, 13 Aug 2026 00:16:42 +0000</pubDate>
    </item>
    <item>
      <title>理解 offset-anchor 属性</title>
      <link>https://huachaowang.com/thread-95343-1-1.html</link>
      <description><![CDATA[.pa {
        width: 800px;
        height: 400px;
        border: thin solid gray;
        background: beige;
        position: relative;
        margin: auto;
    }
    .wrap p { margin: 12px 0; }
    .son {
        width: 100px;
  ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Sun, 09 Aug 2026 04:22:11 +0000</pubDate>
    </item>
    <item>
      <title>多图循环平滑移动之background实现方式</title>
      <link>https://huachaowang.com/thread-95284-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox p { margin: 10px 0; }



    一、实现原理：
    background 是 background-image、background-repeat、bac ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Fri, 07 Aug 2026 04:24:36 +0000</pubDate>
    </item>
    <item>
      <title>纯CSS实现多图无限平滑循环滚动（通用方法）</title>
      <link>https://huachaowang.com/thread-95227-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox blockquote { padding: 14px; border: solid gray; border-width: 0 4px; border-radius: 10px; background: #ddd; ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Wed, 05 Aug 2026 04:58:57 +0000</pubDate>
    </item>
    <item>
      <title>单图片背景循环移动精简版</title>
      <link>https://huachaowang.com/thread-95200-1-1.html</link>
      <description><![CDATA[&amp;lt;style&amp;gt;
    /* 容器元素 */
    #mydiv {
        margin: 20px 0 20px calc(50% - 720px); /* 水平方向居中 */
        width: 1440px;
        height: 810px;
        background: skyblue;
        box-shadow: 4px 4px 8px #000;
        position: ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Tue, 04 Aug 2026 10:32:21 +0000</pubDate>
    </item>
    <item>
      <title>江上清风游</title>
      <link>https://huachaowang.com/thread-95153-1-1.html</link>
      <description><![CDATA[@import \'https://638183.freep.cn/638183/web/api/audioplayer.css\';
    .pa { --offsetX: 81px; color: yellow; }
    .pa::before, .pa::after { position: absolute; content: \'\'; inset: 0; background: url(\'https://638183.freep.cn/638183/t24/7/t24.j ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Mon, 03 Aug 2026 12:01:13 +0000</pubDate>
    </item>
    <item>
      <title>clip-path剪裁的元素如何投射阴影</title>
      <link>https://huachaowang.com/thread-95104-1-1.html</link>
      <description><![CDATA[.artBox { margin: 20px auto; font: normal 18px/26px sans-serif; }
    .artBox mark { padding: 2px 6px; background: #ccc; }
    .artBox p { margin: 10px 0; }



    使用 clip-path CSS属性剪裁的元素，box-shadow 或 filter: drop-shadow() 创建 ...]]></description>
      <category>马黑黑教程专版</category>
      <author>马黑黑</author>
      <pubDate>Sun, 02 Aug 2026 04:30:03 +0000</pubDate>
    </item>
  </channel>
</rss>