前端之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

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

相关推荐
广州华水科技11 分钟前
单北斗变形监测一体机在基础设施安全与地质灾害监测中的应用价值分析
前端
Dragon Wu17 分钟前
Electron Forge集成React Typescript完整步骤
前端·javascript·react.js·typescript·electron·reactjs
芳草萋萋鹦鹉洲哦17 分钟前
【Tailwind】动画解读:Tailwind CSS Animation Examples
前端·css
华仔啊20 分钟前
jQuery 4.0 发布,IE 终于被放弃了
前端·javascript
一心赚狗粮的宇叔25 分钟前
03.Node.js依赖包补充说明及React&Node.Js项目
前端·react.js·node.js
子春一27 分钟前
Flutter for OpenHarmony:音律尺 - 基于Flutter的Web友好型节拍器开发与节奏可视化实现
前端·flutter
JarvanMo27 分钟前
150万开发者“被偷家”!这两款浓眉大眼的 VS Code 插件竟然是间谍
前端
亿元程序员28 分钟前
大佬,现在AI游戏开发教程那么多,你不搞点卖给大学生吗?
前端
未来龙皇小蓝39 分钟前
RBAC前端架构-02:集成Vue Router、Vuex和Axios实现基本认证实现
前端·vue.js·架构
晓得迷路了1 小时前
栗子前端技术周刊第 116 期 - 2025 JS 状态调查结果、Babel 7.29.0、Vue Router 5...
前端·javascript·vue.js