编程狮HTML 入门体验课程：三个实战场景带你轻松上手学，支持html5、html 在线、HTML实时处理，免登录打开即用。本文讲清它的核心原理、典型使用场景、操作步骤与常见避坑要点，文末附在线入口，照着做就能直接上手。

CSS 画三角形到底有几种：三种最常用方式讲清是新手常会卡住的点。本文用通俗的步骤讲清CSS、border、clip的实操做法、适用场景与常见坑，并给出可直接套用的方案与示例代码，照着做就能一次跑通，帮你少走弯路。

CSS 隐藏元素到底有哪几种：四种写法差别在哪是新手常会卡住的点。本文用通俗的步骤讲清CSS、display、opacity的实操做法、适用场景与常见坑，并给出可直接套用的方案与示例代码，照着做就能一次跑通，帮你少走弯路。

CSS 两栏布局最推荐用 flex 实现：给容器写 display: flex，左栏定宽、右栏 flex:1 即可天然等高、随容器伸缩。本文一次讲清 float、flex、grid 三种常见方案，对比兼容性与响应式写法，帮你避开父容器塌陷、小屏横向溢出、两栏不等高等高频坑，快速选对适合项目的布局方式。

CSS 文字居中常用四种方法：text-align 实现水平居中，line-height 实现单行垂直居中，flex 通过 justify-content 与 align-items 同时居中，grid 用 place-items 居中。多行文字优先选 flex 或 grid，简单水平居中用 text-align 即可，垂直居中记得给父容器一个明确高度。

清除浮动最稳妥的方案，是给浮动的父元素加一个 ::after 伪元素并写 clear:both，也就是前端常说的 clearfix 写法。本文对比 clear:both、overflow:hidden、伪元素 clearfix 三种主流方法，讲清浮动塌陷的成因、各自的适用场景与常见坑点，并给出选型建议，帮你给不同布局选对清除浮动方案。

数组去重最省事的写法是 [...new Set(arr)]，一行搞定且保序。本文基于现代浏览器与 Node.js 验证，覆盖 Set、filter、reduce、for、Map 六种写法，附 5 万条实测耗时对比，并单独讲对象数组按字段去重，以及 NaN 会被 indexOf 静默丢弃的坑。

CSS 垂直居中现代最稳的是 Flexbox：父容器 display:flex 加 align-items:center 一行搞定，也可用 Grid 的 place-items:center。本文覆盖 flex、grid、绝对定位、line-height 四种方法，附场景对比表，并讲清父容器没有确定高度时为什么不生效，以及几个高频误区。

计算属性的缓存是：只要依赖的响应式数据没变，无论访问多少次，计算函数都只执行一次。本文用可运行的最小示例讲清缓存何时生效、何时失效，并给出三个使用要点：依赖不变就不重算、计算函数要写成纯函数、依赖必须是响应式数据。

本文详细讲解React，覆盖Hook、Vue、React+Redux等核心要点，从基础概念到实操步骤层层拆解，并给出可直接套用的多种实践方法，附带常见坑点与适用场景说明，帮你快速掌握React的使用思路与避坑技巧。