CSS3
文章平均质量分 87
demo软件园
微信公众号‘demo锁屏面试题’获取更多免费学习资源
展开
-
锁屏面试题百日百刷-CSS篇(一)
你了解的浏览器的重绘和回流导致的性能问题 重绘(Repaint)和回流(Reflow) 重绘和回流是渲染步骤中的一小节,但是这两个步骤对于性能影响很大。 重绘是当节点需要更改外观而不会影响布局的,比如改变 color就叫称为重绘 回流是布局或者几何属性需要改变就称为回流。 回流必定会发生重绘,重绘不一定会引发回流。回流所需的成本比重绘高的多,改变深层次的节点很可能导致父节点的一系列回流。 所以以下几个动作可能会导致性能问题: 改变 window 大小 改变字体 添加或删除样式 文字改变 定位或者浮动 盒模型原创 2021-07-17 23:14:54 · 122 阅读 · 0 评论 -
关于flex布局学习分享
大家好,这里是demo软件园,今天为大家分享的是flex布局。 **flex布局:**CSS3 弹性盒子(Flexible Box 或 Flexbox),是一种用于在页面上布置元素的布局模式,使得当页面布局必须适应不同的屏幕尺寸和不同的显示设备时,元素可预测地运行行/列。 对于学习flex布局我们得首先知道以下技术点: –什么是容器,什么是项目,什么是主轴,什么是侧轴? –项目永远排列在主轴的正方向上 –弹性盒子模型分老版与新版: 老版本的我们通常称之为box:-webkit-box 新版本的我们通常称之为原创 2021-03-22 19:05:43 · 107 阅读 · 0 评论 -
Bootstrap的学习分享
大家好,这里是demo软件园,今天为大家分享的是Bootstrap的学习分享。 众所周知Bootstrap是一款简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。 流体布局容器 容器的width为auto,只是两边加了15px的padding。 固定布局 容器的width会随设备分辨率的不同而生产变化 分辨率阈值 w >=1200 容器的width为1170 左右padding为15 (注意是borderBox) 1200>w >=992 容器的width为970 左右原创 2021-03-19 19:32:32 · 95 阅读 · 0 评论 -
css3中的动画学习分享
大家好,这里是demo软件园,今天为大家分享的是css3中的动画(animation)。 css3动画: 使元素从一种样式逐渐变化为另一种样式的效果。 动画原理:通过把人物的表情、动作、变化等分解后画成许多动作瞬间的画幅,利用视觉暂留的原理,在一幅画还没有消失前,播放下一幅画。就会给人造成一种流畅的视觉变化效果。 animation属性是一个简写属性形式: (可以用来描述可动画的属性) 可动画属性的列表: https://developer.mozilla.org/en-US/docs/Web/CSS/CS原创 2021-03-17 20:40:43 · 175 阅读 · 0 评论