星野集-个人编程学习与开发笔记归档

CSS3核心特性-第8章-8.4-自定义字体（@font-face）

8.4 自定义字体（@font-face）学习目标掌握@font-face规则的语法结构及字体格式要求理解字体文件格式（TTF/OTF/WOFF）的兼容性差异学会优化自定义字体加载性能（字体子集、预加载策略）能够解决自定义字体在不同浏览器中的渲染问题概念讲解 @font-face是CSS

笔记 CSS

写CSS时，最让人纠结的问题之一大概是：该用padding还是margin？这两个属性都能“留空”，但用错了可能导致布局错乱、样式不符合预期。本文用最直白的语言+生活化类比，帮你彻底理清两者的区别，并总结一套“傻瓜式”选择指南。一、核心概念：padding是“内衬”，margin是“外隔”——从

笔记 JavaScript

你有没有遇到过这种情况？用户输入框里填了 "123"，你想用它做数学计算，结果直接加 5 却得到 "1235"；或者从接口拿到 "99.9" 这样的字符串，想转成数字却发现计算时总出错…… 这时候，你需要用到 JavaScript 中的“数据解析”工具——parseInt 和 parseFloat

笔记 JavaScript

你可能在写JavaScript代码时见过这样的片段： let b; if (!b) { console.log("执行这里的代码"); } 或者更常见的是检查用户输入： let userName = document.getElementById("username").value; // 获

笔记 JavaScript

你有没有在写JS代码时遇到过这些“迷惑行为”？比如明明写了 1 + "1"，结果得到的是 "11" 而不是 2；或者用 == 比较 "" 和 0，居然得到 true；又或者明明变量是 null，和 undefined 比较却返回 true…… 这些“不按常理出牌”的结果，其实都和JavaScrip

笔记 JavaScript

你可能在代码里见过类似 a <<= 2或者 b >>= 1这样的写法，看起来像数学里的「大于等于」符号被拆开了？其实这是 JavaScript 中的移位赋值运算符。它的作用听起来有点玄乎——通过「移动二进制位的位置」来快速完成计算。别被「二进制位」「移位」这些词吓到，我们用生活中的例子一步步拆解，

笔记 JavaScript

你是不是在学JavaScript时见过别人写 2 ** 3，却不知道这行代码是什么意思？或者想算“一个数的几次方”，却还在用循环乘来乘去？今天咱们就聊聊JavaScript里的取幂运算符 **——它和你数学课里学的“幂运算”是一对好搭档，看完这篇你能彻底搞懂怎么用。一、先回忆：数学里的“幂”是什么

笔记

你有没有在网页上见过这种操作？点击一个按钮，原本小小的文字“唰”地变大了；或者滑动鼠标，标题字号跟着变化。这些效果的背后，其实都离不开JavaScript（简称JS）对网页元素的控制。今天我们就从最基础的一行代码入手，看看怎么用JS修改网页里的文字大小。先搞懂这行代码的“身份” 我们今天要研究的代

笔记 JavaScript

你有没有过这样的经历？整理书架时，想给每一本书贴上标签；或者点奶茶时，想给每个朋友备注不同的口味。这种「逐个处理一组东西」的需求，在编程里特别常见——尤其是当你要处理一个装满数据的数组时。今天咱们就聊聊JavaScript里专门干这个事的工具：.forEach()。它就像一个勤劳的小助手，能帮你把

笔记 HTML

在Web性能优化的世界里，图片始终是“流量大户”——据统计，一个普通网页的加载流量中，图片占比可达60%以上。这意味着：如何高效加载图片，直接决定了用户的等待时间和体验满意度。而“响应式图片”（Responsive Images）正是解决这一问题的核心技术。它不是某种“炫技”的代码技巧，而是W3C