CSS flex 盒子在 Chrome 和 Safari 中的行为差异 问题最近的开发中有遇到一个页面样式的兼容性问题,大致是使用 flex 布局的两个嵌套弹性盒子,在 Chrome 和 Safari 中对一些特殊情况的处理行为不一致,从而产生了测试 bug; 复现下面将问题简化为了一个 demo 模型,一个定 2025-07-31 CSS flex box chrome safari
CSS 单位与尺寸参数 css单位px常用的单位,即像素pixel缩写,但通常被当做绝对单位,但严格说并不是,因为官方考虑到观看不同设备显示屏时,使网页设计出的某一图形的显示大小在人眼中的观看效果差不多,而定义的一个相对值,即人以一臂之遥观看96DPI的显示屏的角 2025-07-31 CSS css单位 px dpi dpr 逻辑像素
CSS 布局模型详细介绍 HTML中元素有三种布局模型:流动模型、浮动模型、层模型。 流动模型(flow)HTML网页默认布局就是流动模型,布局如下: 块级元素(block)**自上而下垂直分布,因为块级元素默认宽度为浏览器窗口的100%,或者理解为每个块级元素默认 2025-07-31 CSS css布局模型 绝对定位 相对定位 固定定位 position
CSS 样式之内容居中方法 水平居中HTML中要实现某一内容水平居中显示,要通过设置css样式来实现,主要分为行内元素和块状元素两种情况,块状元素又可分为块状定宽与块状不定宽两种情况,接下来依次介绍分析。 行内元素像 a、span、i 这类元素叫做行内元素,文本和图片 2025-07-31 CSS css水平居中 css垂直居中
CSS 选择器详细介绍 文章出自个人博客https://knightyun.github.io/2018/05/02/css-selector,转载请申明 目录 基础 选择器 元素选择器 类选择器 ID选择器 ID选择器与类选择器的区别 子选择器 后代选 2025-07-31 CSS css选择器 内联嵌入外部式 ID类选择器区别 伪元素
CSS3 过渡与动画 CSS3中出现很多新的特性,下面就讲一下其中比较好玩的3D操作,过渡和动画效果; 过渡(transition)过渡就是使瞬间的样式变化,按照一定方式变得缓慢平缓; 例如鼠标划过超链接时颜色的变化,点击按钮后的颜色变化等,默认转化都是瞬间完成 2025-07-31 CSS css3过渡 css3动画 transition animation
CSS3 之 2D 与 3D 变换 目录 目录 关于坐标轴 2D变换 translate(x,y) rotate(deg) scale(x,y) skew(xdeg,ydeg) matrix(a,b,c,d,e) 3D变换 translate3d(x,y,z) rota 2025-07-31 CSS css2d css3d transform