巽的博客

小红书有个博主自己搞的笔记排版工具叫“流光卡片”，类似的还有个Markdown排版工具叫MD2Card。我这个版本类似，但是自己写的东西，控制性更好。初期就写了个静态页面，后期结合Godot快速生成，并可能结合JS库（例如html2canvas）实现生成页面转图片以及批量下载。

最近想做一个卡片形式的网页工具，可以生成好看的小红书笔记，不喜欢用前端别人写的东西，尝试了一下CSS原子化，确实能用比较少的代码完成很好的功能。结合一些现成的工具，可以很简单的扩展样式。

仅个人使用，复习ES6的笔记，比较粗糙，仅适用于浏览器端。

模块功能主要有两个命令，export和import。一个js文件就是一个模块。

私有变量变量名前带#即可。上面代码表示的类图关系如下：

(原文写自2024年10月9日，整理笔记所以现在发出)HTML5 Canvas并不是一项很新的技术了，但是作为一名业余程序员，我是不需要考虑新旧技术和投入实际生产的问题，相反，我只需要考虑有趣，什么有趣搞什么。在Godot中玩味了一圈CanvasItem的绘图函数，也慢慢补齐了一点三角函数、向量和线性变换的基础之后，发现绘图才是程序中最有意思的内容。关于Canvas的2D绘图指令，确实没有必要重复讲述，有很好的文章和在线文档讲述这些内容。

内部表现定义其内部子元素的显示和布局。属性，使元素脱离原始的文档流浮动布局。文本和内联元素可以环绕浮动元素。默认按容器最多能容纳的最小宽度。内容：所有被排列元素组成的区域。并且如果元素宽度大于最小宽度。时，会减少元素个数，换行排列。：指定垂直方向元素的对齐方式。：指定水平方向元素的对齐方式。随页面宽度变化动态排列元素。：内部元素类似表格形式布局。外部表现定义元素自身的显示。：相对定位，相对父元素定位。可以指定固定宽度或浮动宽度。容器：包裹被排列元素的元素。元素：就是容器的直接子元素。