注：
今天尝试了一个“新”技术，多张图片的左右滑动，感兴趣的可以看后记部分。
仓库：jordanbaird/Ice
点评： Ice是一个支持macOS 14及以上版本的功能强大的菜单栏管理工具，主要功能是隐藏和显示菜单栏项目。它提供多样化的附加功能，目标是成为市面上最全能的菜单栏工具之一。Ice目前仍在积极开发中，未来将添加更多特性，如拖放排列、搜索菜单项等。支持自定义图标和菜单栏外观，以及快捷键操作，来看下截屏。
设置界面截图-暗色模式：
为菜单栏中选择自定义的图标：
自定义菜单栏的外观：
<<< 左右滑动见更多 >>>
后记：
今天尝试了一个对个人来说的“新”技术：图片左右滑动。之前好奇：文章中的左右滑动是如何出来的，因为微信公众号等的官方编辑器都不带这个，又不想用那些带各种限制，或者要收费的第三方编辑器，一番搜索琢磨后才恍然大悟：可以阅读自媒体文章的App（头条、微信、知乎等）其实都可以看成是：包含了一个 HTML5 浏览器的App。这样，只要是它们的浏览器支持的标签、样式、脚本等，就都可以渲染出来。
要实现图片的左右、上下滑动，有好几种技术，包括HTML5、CSS、JavaScript、SVG等等；大部分第三方编辑器和在线工具用到的主要技术都是 HTML5 中新增的 <section> 标签和相关属性，这个标签定义了一个文档中的一个区域（或节）。它通常用于将内容分为不同的部分或者不同的主题，利用它，可以用来更好地构建页面结构。整篇文章都可以通过N个<section>来嵌套组成。
关于滑动技术的讲解，就不重复造轮子了，感兴趣的可以看这篇文章：https://mp.weixin.qq.com/s/TB8mQt1o4o-nX8T3UXmXEA。实际在用的时候，发现存在Gitee上的两张滑动图片，总是提示载入失败，没法拉取，无奈只能暂且手工上传素材库，并替换链接。
下面稍微介绍下<section>标签。
主要特点
结构化内容： <section>用于将相关的内容组织在一起，通常包括一个标题（<h1>-<h6>）和内容。语义化：它提供了更多的语义信息，使得搜索引擎和辅助技术（如屏幕阅读器）更好地理解页面的结构。 独立性：每个 <section>通常都是独立的，可以单独存在，并且通常都有自己的标题。嵌套使用： <section>标签可以嵌套使用，以创建更复杂的文档结构。
使用场景
文章的主体内容可以分为几个部分，每个部分使用 <section>标签。页面中的不同功能模块，如产品介绍、用户评论等。 在一个多步骤的表单中，每个步骤可以用 <section>标签划分。
基本语法
<section>
<h2>标题</h2>
<p>内容...</p>
</section>
示例
<!DOCTYPE html>
<html>
<head>
<title>页面标题</title>
</head>
<body>
<header>
<h1>网站标题</h1>
</header>
<nav>
<!-- 导航链接 -->
</nav>
<section>
<h2>第一部分</h2>
<p>这是第一部分的内容。</p>
</section>
<section>
<h2>第二部分</h2>
<p>这是第二部分的内容。</p>
</section>
<footer>
<!-- 页脚内容 -->
</footer>
</body>
</html>
注意事项
不要仅仅为了使用 CSS 或 JavaScript 而使用 <section>标签。只有当内容可以被独立地划分和组织时，才使用它。如果 <section>标签中的内容是围绕某个主题的，考虑使用<article>标签。<section>标签通常需要包含一个标题，以便明确地区分内容区域。
