前端之CSS篇--面试题总结

CSS的特性:继承性、层叠性、优先级

优先级:写css样式的时候,会给同一个元素添加多个样式,此时谁的权重搞就显示谁的样式。

!important >行内样式>id>类>标签>全局选择器

隐藏元素的方法

display:none 元素在页面上消失

opacity:0 设置了元素的透明度 占据页面空间

visibility:hidden 让元素消失,一种不可见的状态,占据空间位置

position:absolute; 绝对定位,脱离文档流,不占父级空间

px和rem的区别

px:相对单位长度,像素,显示器上给我们呈现画面的像素,每个像素大小一样

rem:绝对单位长度,相对于html根节点的font-size值

重排和重绘

重排:对DOM的大小、位置修改后,布局引擎会重新计算盒模型在页面上的位置和大小

重绘:对DOM的样式进行修改,比如color、background-color,浏览器不需要重新计算几何属性的时候,直接绘制该元素的新样式,那么这里就只触发了重绘。

元素水平居中的方式

1.margin: auto

2.transform:translate 元素将在水平和垂直方向上各自移动其自身宽度和高度的50%的距离

3.flex布局 弹性布局

预处理器

预处理语言增加了变量、函数、混入等强大的功能 ,解决css代码过长、重复的问题,书写css更加方便。SASS、LESS

例如:都想用红色,一个个改很麻烦,可以直接通过修改变量

相关推荐
ricardo197333 分钟前
手写一个虚拟列表,万级数据滚动 FPS 稳定 60 帧
前端
小KK_35 分钟前
新手必看:一篇文章带你搞懂JavaScript作用域
前端
万邦科技Lafite36 分钟前
如何通过 item_search_img API 接口获取淘宝商品信息
java·前端·数据库
AlbertZein44 分钟前
干了三年全栈才悟到:TS + React 这套组合,真不是堆技术堆出来的
前端
化为五月44 分钟前
我把 Hermes 接进了飞书,结果卡在“能发消息但就是不回”
前端
ClouGence1 小时前
豆包收费之后,我找到了更好用的 AI 工具
前端·人工智能·后端·ai·ai编程·ai写作
aircrushin1 小时前
音乐节结束前,拿手机📱搓了一个工具
前端·后端
风骏时光牛马1 小时前
Cube Sandbox部署问题及解决方法
前端
Bug-制造者1 小时前
深入理解 HTML5 Web Workers:提升网页性能的关键技术解析
前端·html·html5
Sylvia33.1 小时前
足球数据API接入实战:从认证到实时比分推送的完整指南
java·开发语言·前端·c++·python