截止发文, MDN 收录的 CSS 属性大约 135 个(不包括特定浏览器的属性,所有可合并的属性算作一个,比如 margin-left 和 margin-right 都记作一个属性)。 这些 CSS 属性中,老师傅也有见过的,用过的,也有没见过的,甚至都没听过的。 这些属性中有高频使用的,也有基本 Read More
埋头苦写多年的 CSS,从没注意到 CSS 被浏览器分了类,直到偶然的一次翻阅开发者工具,才发现原来 CSS 属性也被浏览器归类收纳了。 Chrome 下面是 Chrome 的开发者工具中 CSS 的属性归类截图,一般情况都不会注意它,毕竟代码不出问题,谁会关心 CSS 属性是哪一类? 当我偶然看到 Read More
学编码之前,当先学排查问题的能力。 在那个 IE 浏览器 当道的时代,前端开发简直就是刀耕火种一般,一个简单的圆角模块,嘿...不好意思,它不支持,用图片吧。 但凡经历过 IE 的洗礼,就会知道当时哪些 红极一时 的浏览器 bug,特别是 IE 6,它真是一个 老六 啊,悄悄咪咪的挖了好多坑,刚填平 Read More
曾经,CSS 颜色的写法很专一,就只有十六进制写法(#ff0000)和关键字写法(red)。 现在,它变了,变得花样多了,各种招式眼花缭乱。 以红色(red)为例: 1. 颜色关键字 直接使用预定义的颜色名称: color: red; 解释 直接使用关键词 red。 2. 6位十六进制 使用完整的 Read More
单位就是那个形容长度大小的东西。比如身高180cm(厘米),cm就是单位。 css 也不例外,要描述一个盒子的大小,就必须要用到单位。 css 单位根据其作用分为几大类:绝对单位、相对单位、视口单位、角度单位、时间单位、网格单位、频率单位、分辨率单位。 动态计算单位 认识单位之前,先认识几个动态计算 Read More
任何地方都存在阶级,CSS 选择器也不例外,也会讲一个三六九等。 选择器类别 通配符选择器 标签选择器 类选择器 ID选择器 属性选择器 伪类选择器 伪元素选择器 关系选择器 流传已久的阶级划分 选择器 权重 继承父标签的样式、* 通配符选择器 0,0,0,0 标签选择器 0,0,0,1 类选择器、 Read More
HTML 在语法上并无大小限制,所以其结构可以浩瀚无边,CSS 选择器的作用则是在这些复杂的 HTML 结构中进行元素定位。 示例代码 记住此代码,后面所有的 css 选择器都是基于此代码。 注意:代码中存在两个一样的 id="p1" 元素,仅为了演示效果,正常编码中请保证 id 唯一性。 <!DO Read More
默认情况,VSCode 的代码类型提示需要鼠标放置在函数名或者变量名上才出现,有没有觉得这样比较傻瓜~ VSCode 早在 1.60 版本就引入了内嵌提示配置,每次更新都没仔细看文档,感觉错过了很多的小惊喜啊。 默认的代码显示 你的编辑器代码是不是显示这个样子: 开启内嵌的类型提示 开启内嵌提示之后 Read More
HELLO,这里是大熊的前端开发笔记。 先了解一个关键词 FCP (First Contentful Paint): 首次内容绘制,指的是浏览器渲染来自 DOM 的任何内容(包括文本、图像、SVG 等)的时间点。这是用户第一次看到页面上出现的内容,标志着页面开始有内容展示给用户。 使用 开发者工具 Read More
HELLO,这里是大熊学习前端开发的入门笔记。 本系列笔记基于 windows 11 系统。 HTML 页面内容越来越多,势必 CSS 也会跟着膨胀,如果 CSS 还是用内部样式表,那会导致 HTML 页面代码行数将会超长,这时候聪明的人类就会想到把 CSS 抽离出来单独管理,这时候外部样式表就诞生 Read More