- css基础2025-09-25 11:38:46
05-05 color-min()
color-mix()函数是[CSS 颜色模块 Level5](https://www.w3.org/TR/css-color-5/color-mix)新增的一个颜色函数,主要用于混合两种颜色值的 CSS 函数,它可以在不同的颜色空间进行混合,例如 sRGB、HSL 和 LCH 等,这在调整颜色时更加灵活,并且可以根据需要选择合适的颜色空间进行混合 语法  - css基础2025-09-25 11:38:25
05-02 色域和颜色空间
Web 历史概述 CSS 在 1996 年引入 Web 时,大多数计算机显示器都非常糟糕,大多不是高清的。无论是使用 RGB 、HSL 或 HEX (十六进制)定义的颜色,都是在 sRGB 色域内,仅适用于当时的显示器。 现在,大多数新设备都具备广色域显示能力,比如使用 [Display P3 色域](https://en.wikipedia.org/wiki/DCI-P3),甚至还有像 [Rec.2020](https://en.wikipedia.org/wiki/Rec._2020) 更大的色域。广色域显示器能够显示比 sRGB 更多的颜色。 - css基础2025-09-25 11:37:28
05-01 RGB&HSL&HWB&LAB&LCH
概述 CSS 颜色的各种格式的值都可以用于可接受<color>值类型的属性 css - css基础2025-09-25 9:58:40
05-04 相对颜色语法
[CSS 颜色模块 Level 5 ](https://www.w3.org/TR/css-color-5/relative-colors)为 CSS 颜色函数引入[相对颜色语法](https://www.w3.org/TR/css-color-5/relative-colors),此语法允许基于另一个颜色定义新颜色 from [color] 通道关键字 此语法可以将一个起始颜色,转换为对应颜色空间的通道关键字 - css基础2025-09-25 9:33:10
05-03 OKLCH&OKLAB
来源 OKLAB 和 OKLCH 颜色空间是由 [@Björn Ottosson](https://twitter.com/bjornornorn) 于 2020 年创建的,它们被创建的主要原因是为了解决 LAB 和 LCH 的问题,即解决色调偏移的错误,所以它们又称为 LAB 和 LCH 的修正版本。[@Björn 撰写了一篇优秀的文章](https://bottosson.github.io/posts/oklab/),详细介绍了为什么创造它们,以及它们的实现细节。 OKLAB 是一种基于 CIELAB 颜色空间的颜色模型,通过对不同光源下的颜色重新调整,尽可能减少颜色失值。而 OKLCH 则是在 OKLAB 的基础上发展而来的颜色类型,它增加了颜色的饱和度和色调信息,使得在设计中能够更好的进行颜色变化和搭配。 - css基础2025-09-22 9:35:4
04-01-显示默认值
inherit、initial、unset和revert是 CSS 的全局关键词,理论上,它们可以应用于除none以外的任何 CSS 属性。它们在 CSS 中也被称为CSS 显式默认值,其中inherit、initial和unset是 CSS3 规范中定义的,revert是在 CSS4 规范中定义的 CSS相关基础知识 CSS 属性的初始值 - htmlhtml5基础2025-09-20 12:38:21
04-01 dialog
基本用法 <dialog>标签表示一个可以关闭的对话框,当<dialog>元素添加了open属性之后,浏览器会将该元素的display重置为block,即: css - css基础2025-09-19 11:11:10
02-03 文档流
标准文档流 标准文档流即把内容按照从左到右、从上到下的顺序进行排列显示 文档流就像水一样,能够自适应所在的容器 - css基础2025-09-19 11:11:7
03-01 视觉格式化模型-基础概念
视觉格式化模型(Visual formatting model) 视觉格式化模型(Visual formatting model)是用来处理和在视觉媒体上显示文档时使用的计算规则,CSS 中一切皆盒子,而视觉格式化模型简单来理解就是规定这些盒子应该怎么样放置到页面中去 > [官方文档](https://www.w3.org/TR/CSS22/visuren.html) - css基础2025-09-19 11:11:1
01-01 CSS 架构
BEM - block:块 - element:元素 - csscss 选择器2025-09-19 11:48:27
04 伪类
:hover 选择鼠标指针浮动在其上的元素 1. 延时触发 - csscss 选择器2025-09-19 11:30:18
06 逻辑选择器
:is() :is()CSS伪类函数将选择器列表作为参数,并选择该列表中任意一个选择器可以选择的元素 基础用法 - csscss 选择器2025-09-19 11:21:0
01 选择器优先级
优先级 | 权重 | 选择器 | | ----- | ------------------------------------------------------------ | - csscss-揭秘2025-09-17 9:54:23
7-3 根据兄弟元素的数量来设置样式
当有 n 个 li 时,命中 li 父元素选择器 公式 css - css基础2025-09-17 4:30:11
03-02 视觉格式化模型-格式化上下文(FC)
BFC(Block Formatting Contexts)块级格式化上下文 1、触发 BFC 的条件 - 根元素(<html>) - css基础2025-09-12 6:28:50
01-02 At规则
> 参考文档:[MDN](https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_syntax/At-rule) 总览 | 规则 | 作用 | - css基础2025-09-12 6:28:50
02-01 层叠顺序与堆栈上下文
层叠顺序(stacking level) :::dom html - css基础2025-09-12 6:28:50
02-02 盒模型
盒模型注意点 1.padding不能为负值,但margin可以为负值 2. 背景色会平铺到非margin区域 - css基础2025-09-12 6:28:50
02-04 float 浮动
浮动元素与常规流元素的关系 1. 常规流块级元素认为浮动元素不存在 :::demo - css基础2025-09-12 6:28:50
CSS 动画
@keyframes 和 animation 1. ·@keyframes· css - css基础2025-09-12 6:28:50
元素不可见
>display: none、visibility: hidden、opacity: 0 结构 1.display: none:会让元素完全从渲染树中消失,渲染的时候不占据任何空间, 不能点击 - css基础2025-09-12 6:28:50
雪碧图
理念和优缺点 理念:将多个⼩图⽚拼接到⼀个图⽚中。通过background-position和元素尺⼨调节需要显示的背景图案。 优点: - csscss 选择器2025-09-12 6:28:50
02 选择符
后代选择符 空格() 选择某元素的所有后代元素 1. 容易混淆的点:当权重相同时,后面覆盖前面 - csscss 选择器2025-09-12 6:28:50
03 属性选择器
[attr] 匹配包含指定属性的元素 1. 注意点:disabled - csscss 选择器2025-09-12 6:28:50
05 树结构伪类
:root 匹配文档根元素,在 html 中可以理解为就是<html>元素 1. 与 html 元素的区别 - csscss 选择器2025-09-12 6:28:50
07 数学函数
calc() 允许在声明 CSS 属性值时执行一些计算 加减乘除 - javascript基础2025-09-11 11:36:47
25-02 Web-Storage
Storage API - 设置数据:setItem(key,value) - 获取数据:getItem(key) - javascript基础2025-09-11 11:22:55
25-01 cookie
> 随着Web应用的发展,与用户相关的特定信息保存在对应用户的机器上,如登陆信息、个人偏好等 > > cookie 就是对需求的第一个解决方案 - htmlhtml5基础2025-09-11 10:8:57
02-05 表格标签
表格标签 | 标签 | 含义及作用 | 特殊 | | ------------ | ---------- | ------------------------------------------------------------ | - htmlwebapi2025-09-11 10:8:57
01-02 Canvas-绘制图形
beginPath 、closePath beginPath() - 开始一条新的路径,调用此方法后,之前的所有路径会被清空,开始绘制新的路径
类型归档
web
html
css
javascript
node
jquery
typescript
vue
react
echarts
electron
前端工程化
java
elastic
mysql
python
flutter
git
算法
部署
图形学
ai