欢迎来到叶寻的博客。这里随笔与技术内容较多，但没有固定的话题。
CSS Grid 布局教程
CSS Grid 是二维布局方法，也就是用竖线和横线将内容划分成格子，像棋盘一样。本文只介绍常见用法，要了解全部用法请看 MDN Web Docs。推荐大家看完后做文末提到的习题。 概念 # 网格容器（Grid Container）、网格项（Grid Item） # display: grid | inline-grid 使元素变成网格容器，其子元素叫网格项（其他后代不算），按照网格布局排列。下面代码的 .container 是网格容器，.item 是网格项，.sub-item 不是网格项。
CSS BEM 命名规范入门教程
BEM（Block, Element, Modifier）是 HTML/CSS 类的命名方法，它可以让 HTML 和 CSS 代码更有条理。 概念与用法 # 一开始看不懂没关系，后面有示例。 block（块）：可以独立使用的 HTML 元素（比如：<nav>），可以不包含 element。 element（元素）：依附于 block 的 HTML 元素，无法独立存在（比如：<li>），前面要加上双下划线 __。 modifier（修饰符）：表示 block 或者 element 的状态和外观，前面要加上双连字符 --。 用单连字符 - 连接单词，比如：search-form。 element 只属于 block，而不是另一个 element。错误写法：block__element1__element2，正确写法：block__element2。 使用 modifier 时，同时保留不含 modifier 的类名，比如：<a class="menu__link menu__link--active" href="/zh-cn/">主页</a>。 HTML 示例 # <nav> 元素是 block，它包含的 element 有 <ul>、<li>、<a>。--active 是修饰符。
CSS Flexbox 布局教程
Flexbox（弹性盒子）是一维的布局方法，也就是在一条横线（row）或者竖线（column）上排列元素。推荐大家看完本文后做文末提到的习题。 flex 容器的属性 # flex 容器（flex container）的属性有 display、flex-direction、flex-wrap、flex-flow、justify-content、align-items、align-content、row-gap、column-gap、gap。
用柠檬酸和热水去除电热水瓶和保温瓶的水垢
柠檬酸是天然的清洁剂，可去除电热水瓶和保温瓶内的顽固水垢。它的用法是先浸泡，后清洗。如果水垢未完全清除，可以重复上述步骤。 材料 # 柠檬酸除垢剂 电热水瓶浸泡方法 # 倒入冷水和柠檬酸（用量请参考说明书）。 煮沸后继续浸泡 30 分钟。 保温瓶浸泡方法 # 先倒入热水，再倒柠檬酸。 浸泡 3~4 小时。 清洗方法 # 电热水瓶和保温瓶的清洗方法是一样的。
2024-08-03 本站改动：使用 Yue 主题和 giscus 评论，post 目录改为 posts
本文列举了本站于2024年7月28日至2024年08月03日的改动。 清理无用文件 使用我写的 Yue 主题（感觉自己从几乎不折腾博客一下走到折腾博客的尽头了，用自己的主题太爽了，哈哈） 讲 utterances 评论服务改为 giscus（终于可以回复评论了，不需要引用文字或者 @） 将 post 文件夹改为 posts 改动很多，最好在 Git 仓库建一个分支搭配子域名（如 test.cyrusyip.org）测试，没问题再合并代码至主分支。修改网站要注意功能和链接（URL）变动，改了链接要修改文章内部链接、重定向、迁移评论。
Hugo：自定义标签标题
背景 # 一开始我用 Hugo 做中文网站时打算在文章里用中文标签，但是链接里面的中文会被转换为人类读不懂的字符。比如：/zh-cn/tags/博客/ 会变成 /zh-cn/tags/%E5%8D%9A%E5%AE%A2/。我不喜欢这样，当时搜索一番也没找到办法，就用英文标签了。现在终于知道怎么改了，最终改为链接里面还是用英文，但是页面就显示中文。
菜谱：煎荷包蛋
材料与工具 # 冷藏的鸡蛋（1 个约 51g） 电磁炉 精铁平底炒锅（已开锅） 花生油（不要使用菜籽油这种低闪点的油，热锅后倒下去可能会着火） 锅铲 筷子 计时器 两个碗（一个装鸡蛋，另一个装少量水） 第一次煎蛋的流程 # 打蛋到碗里 打开计时器记录热锅时间（后面会用到），电磁炉开到最高档位（2200w）。用手沾一点点水甩入锅，如果直接蒸发就是温度不够，如果水珠弹跳说明温度够了，记下热锅时间，重置计时器，等水珠蒸发。 暂停电磁炉，倒油，摇晃锅使锅底都被油覆盖 倒蛋，马上调到 500W1，按下计时器 等大概 1.5 分钟。等待期间可用锅铲轻推蛋的底部，若不能推动则等待15秒再推，重复此过程直至蛋可以推开。这段时间可以加白胡椒粉2调味。 铲蛋，用筷子夹住边缘并慢慢地翻面 大概煎40秒，试着用锅铲轻推，如果不行就等待后再推，能推开就可以铲起来吃了。 继续煎蛋的流程 # 如果粘锅了，洗锅、烧干水，从头开始 如果没粘锅，铲走残渣后按照第一次的流程煎蛋 注意现在锅里有油，不要洒水测试温度，水和油混合会炸开，请参考第一次记录的热锅时间进行热锅 窍门 # 蛋下锅那瞬间温度要够高，之后根据你的喜好调节温度和煎的时间 要脆的就用更大档位 要嫩的就用更小档位 要溏心蛋就减少煎的时间 要太阳蛋（单面荷包蛋）就一面煎好后加水稍微覆盖锅底，合盖利用蒸汽煮熟热蛋的上面 粘锅时等待一段时间鸡蛋会放开锅底 多加油更容易成功，熟练后再根据自己的喜好调节油量 鸡蛋也可以用常温的 可以直接打蛋到锅中，但是蛋壳弄进去就没法拿出来了，如果你会铁砂掌也可以拿 测试温度的原理是莱顿弗罗斯特现象，水接触温度远超其沸点的铁锅时，水底部会产生有隔热作用的蒸汽，令水沸腾的速度大大减慢 不粘锅煎蛋更容易成功，但是不要干烧，要先加油再加热 可以每次煎 2 个蛋，但是 3 个就太多了，很难翻面 我这个电磁炉 500W 时是间隔加热，持续加热的电磁炉应该也是可以的 ↩︎
Hugo：补全文章的 ISO 8601 日期
背景 # 本网站使用 Hugo 构建，文章日期（date）是这样的： 1 date: '2020-10-02' 这里缺少了时间和时区。于是我给全部文章都设置了同一个时区（时间没填就是 00:00:00），但这个办法有隐患。如果我在另一个时区写文章，这时新的文章还是使用了旧时区。所以最好在每篇文章写上日期、时间和时区。
Hugo：给文章添加 lastmod（上次修改时间）
背景：本站文章的 lastmod（上次修改时间）就是 Git 提交的 author date（作者日期）。我需要批量修改文章（Hugo：补全文章的 ISO 8601 日期），这会导致所有文章的 lastmod 都变成今天。文章内容没变就不应该改 lastmod，所以我打算给每篇文章都加上 lastmod，后面改动文章就 lastmod 就不会变。
拒绝烂词
最近发现自己越来越讨厌网络词语了，但是一直没细想原因，今天决定仔细思考一下。 我讨厌的词语有（次级列表表示讨厌原因）： yyds -> yong yuan de shen -> 永远的神 （形容杰出的人） yyds 是拼音缩写，增加了理解难度。 IP -> intellectual property -> 知识产权（可能指「跨媒体制作」或者「网络红人」） IP 是缩写，增加了理解难度；「跨媒体制作」意思清晰，没必要发明新词；「intellectual property」意思增加了，容易造成歧义。 city walk（在城市散步） 中文已有「散步」，没必要发明 city walk。 走心（原指「变心」或者「走神」。现在网上有「用心」、「动心」的意思，贬义转褒义了） 中文已有「用心」、「动心」，没必要发明新词；「走心」的意思增加了，容易造成歧义。 百元机（1000元人民币以下的手机） 百元机（1000元以下的手机）不符合直觉，百元机按直觉应该是一百元能买到的手机。 千元机（1000元～2000元人民币的手机） 千元机（1000元～2000元人民币的手机）同样是不符合直觉。 emo（引申自 emotion，可以指一切负面情绪，比如：颓废、忧郁、悲伤） emo 意思模糊，你到底是哪种情绪呢？ 这些词语的问题就是：晦涩难懂、不必要地创造新词、重新定义词语导致歧义、不符合直觉、意义模糊。语言的目的就是传递信息，而费解的词语会阻碍这个过程。我写博客时越来越追求文章通俗简洁，所以就很讨厌这些词语。看来我不是讨厌网络词语，是讨厌烂词。