2.9k 字 3 分钟

在一些数字孪生场景特效中，常常有光环的设计。本文在 shadertoy 找了以下三个光环的实现，并解释其实现原理

imgimgimg

2D 的光很简单，一般都有以下类似的函数，当 2D 平面的点离发光位置越远，光就衰减了。

img

2.3k 字 2 分钟

# 国外超火的前端框架：Astro 5.0 正式发布！

Astro 5.0 带来了全新的 内容层 (Content Layer) 和 服务岛 (Server Islands) 功能，实现了从任意来源加载内容的能力，并将静态缓存内容与动态个性化内容完美结合，进一步提升开发效率和网站性能。

# 什么是 Astro？

Astro 是专注于构建内容驱动型网站（如博客、营销和电商）的现代 Web 框架，以快速加载和优秀的 SEO 表现为核心优势。

489 字 1 分钟

# new URL(url, import.meta.url).href

new URL(url, import.meta.url).href

说明：第一个 url 为图片的相对路径

1.2k 字 1 分钟

在 Vue 3 中，你可以通过几种方式使用 SVG 图片。以下是一些示例： # 使用 <img> 标签直接引入 SVG 文件： <template> <img src="@/assets/your-image.svg" alt="Your Image"></template># 将 SVG 作为组件导入并使用： 首先，将 SVG 文件保存到你的组件目录中，并在 Vue 单文件组件中导入并注册为组件。 //...
2.5k 字 2 分钟

css 计数器就是采用 css 给一些 html 元素自动生成编号，比如类似 1.3.2 ，代码如下：

<style type="text/css">
#demo1 ol { counter-reset: section; list-style-type: none; }
#demo1 ol li { counter-increment: section; }
#demo1 ol li:before { content: counters(section, ".") ". "; }
</style>
<div id="demo1">
    <ol>
        <li>进风口的爽肤水
            <ol>
                <li>非进口商的</li>
                <li>非进口商的</li>
                <li>非进口商的</li>
            </ol>
        </li>
        <li>进风口的爽肤水
            <ol>
                <li>非进口商的</li>
                <li>
                    非进口商的
                    <ol>
                        <li>将咖啡色的开发商</li>
                        <li>将咖啡色的开发商</li>
                        <li>将咖啡色的开发商</li>
                        <li>将咖啡色的开发商</li>
                    </ol>
                </li>
                <li>非进口商的</li>
            </ol>
        </li>
        <li>进风口的爽肤水</li>
    </ol>
</div>
   3.8k 字  3 分钟
每个 Node.js 或前端项目中， package.json 都是不可或缺的核心文件。它就像项目的 "身份证"，记录了项目的基本信息、依赖关系、脚本命令等关键配置。本文将详细解读 package.json 中常见且重要的配置项，帮助你更好地管理项目。
   148 字  1 分钟
当我们设置 &lt;el-table&gt; 的 fixed 或 fixed='right' 属性后，会出现行高错位的情况。 解决办法： 在获取完 tableData 后，执行重新校准行高方法 this.$nextTick(() => &#123;	this.$refs.myTable.doLayout();&#125;)