CSS知识点

这里的折叠面板使用了details和summary标签；弹窗面板使用了popovertarget和popovertargetaction属性 CSS代码 HTML代码

元素居中的最快方式： 盒子元素水平垂直居中的最快方式是使用grid布局中的place-content: center;样式 文字元素垂直居中的最快方式是使用align-content: center;

column-count属性将一个元素的内容分成指定数量的列 CSS代码 columns用来设置元素的列宽和列数 CSS代码 HTML代码

HTML片段 CSS片段 当选择black选项时： 当选择green选项时： 当选择blue选项时：

主要使用到animation-timeline: view();和animation-range: entry 0% cover 50%; CSS代码 当然可以根据不同的需求改变更多样式 HTML代码