-
因为height:auto无法参与动画，浏览器需明确数值进行过渡。推荐使用max-height或JS获取scrollHeight实现流畅折叠展开效果。
-
位运算符在前端可用于高效处理奇偶判断、取整、颜色转换、权限管理与数组去重。1.num&1快速判奇偶；2.~~num或num>>0实现浮点数取整，优于Math.floor()；3.通过>>和&拆分HEX颜色值，或用<<与|合并RGB；4.用<<定义权限标志，|组合权限，&检查权限；5.利用^找出成对数据中唯一出现一次的数。虽非常用，但在性能敏感场景具优势。
-
grid-auto-flow用于控制网格项自动排列方式，默认按行填充，可设为列优先或启用密集模式优化空间。
-
absolute定位元素通过z-index控制层叠顺序，z-index值越大越靠前；需注意定位属性缺失、层叠上下文限制及样式覆盖问题。
-
使用fixed定位配合transform居中实现弹窗，通过z-index控制层级，确保遮罩覆盖全屏且点击可关闭，结合语义化结构与交互逻辑完成完整功能。
-
for...in用于遍历对象可枚举属性，包括继承属性，需用hasOwnProperty过滤自身属性；遍历数组时不保证顺序且会遍历非数字键，建议使用for...of或forEach；key始终为字符串类型，Symbol属性不会被遍历。
-
animation-play-state用于控制CSS动画的暂停与播放，其值为running或paused，默认为running；通过:hover或JavaScript可实现悬停暂停、点击切换等交互效果；作用于多动画时统一控制，保持当前帧状态，适用于轮播图等场景，提升用户体验。
-
border是结构边框影响布局，outline是视觉标记不占空间；前者支持圆角并用于稳定UI，后者常用于聚焦提示与临时高亮，且始终为矩形。
-
使用本地服务器可搭建类似在线编程环境，推荐Node.js的live-server或Python内置HTTP服务器，配合VSCode及LiveServer插件实现代码编辑与实时预览，通过iframe动态渲染还可模拟三栏在线运行界面。
-
fixed定位与百分比宽高可共用，但百分比基于视口计算而非父元素。例如width:50%表示视口宽度的一半，常用于创建全屏遮罩或响应式侧边栏，若需按父容器尺寸设置，应改用absolute定位或结合JavaScript实现。
-
固定列与自适应列可通过grid-template-columns结合fr、minmax和auto-fit实现，如200px1fr用于侧边栏+内容区，minmax(300px,1fr)设定最小宽度，repeat(auto-fit,minmax(200px,1fr))实现响应式均分布局。
-
在PyCharm中添加CSS需创建.css文件并用<link>标签引用。首先在项目static或css目录右键新建Stylesheet，命名如style.css；随后在HTML的<head>中通过相对路径或框架语法（如Flask的url_for、Django的{%static%}）引入；PyCharm提供路径提示与代码补全，提升准确性；存放位置推荐遵循框架约定，如Flask/Django的static文件夹，保持资源分离；PyCharm支持CSS自动补全、语法高亮、错误检查、重构重
-
使用JavaScript动态显示实时时间，首先创建HTML容器元素，再通过Date对象获取当前时间并格式化输出，结合setInterval每秒更新一次，支持自定义格式与CSS美化样式。
-
通过transition属性可实现margin平滑变化，如设置transition:margin0.3sease实现悬停时边距过渡；支持单方向控制，如margin-right动画；结合类切换与JavaScript可触发交互式布局调整，需注意起始值为具体数值、避免频繁重排以提升性能。
-
flex-basis用于设置flex子元素在主轴方向的初始尺寸，影响布局分配前的基础大小。其值可为固定长度（如px、%）、auto或content，分别对应具体尺寸、默认宽高或内容所需空间。在横向布局中类似width，纵向则类似height，仅在flex容器中生效。常与flex-grow和flex-shrink结合使用，构成flex简写属性，如flex:11200px表示初始大小200px且可伸缩。推荐避免同时设置width和flex-basis以减少冲突，配合flex-wrap可精准控制换行前的尺寸，提
