随笔分类 - 面试题css
摘要：@font-face { font-family: '名字'; src: url('mycustomfont.woff2') format('woff2'), font-weight: normal; font-style: normal; font-display: swap; } 放到公共样式最
阅读全文
摘要：1.媒体查询 + rem（通过媒体查询更改html根字体大小，实现字体大小随屏幕尺寸变化） @media screen and (max-width:320px){ html{ font-size:12px; } } @media screen and (min-width:321px) and (
阅读全文
摘要：html5 1.语义化标签 答： aside article header footer section nav... 2 增加表单的type类型： number date email momth day... 3.增加表单的属性: placehold required ... 4.新增音频标签（a
阅读全文
摘要：1.关于变量在Less和Sass中的唯一区别就是Less用@，Sass用$ 2.处理机制不同，less是在客户端处理，sass是在服务端处理，相比较之下前者解析会比后者慢一点 3.运行环境不同，sass是要基于Ruby环境，less是基于JavaScript 参考文献：https://www.yis
阅读全文
摘要：1.浮动 + margin(左边元素左浮动，右边元素有浮动，并给两遍元素都设置宽度,然后给中间元素设置 margin-left和 margin-right，值都等于左右元素的宽度) 2.浮动 + BFC() flex(给父元素设置flex布局，然后给指定元素设置flex: 1) 定位(给父元素和左右
阅读全文
摘要：水平垂直居中 答：1. 使用绝对定位 + transform，给子元素添加如下样式(如果子元素的宽高确定的话，translate中的值也可以设置为子元素宽高的一半，即transform: translate(-100px, -100px);) .work { position: absolute;
阅读全文
摘要：答： 可继承： 文字（font-size font-weight font-family font-color） 文本： color line-height text-algin 不可：display， position， 盒子自身（width padding border margin），back
阅读全文
摘要：普通盒模型和怪异盒模型的区别 答： 普通和模型（W3C标准盒模型）：标准盒大小计算公式：width(content) + padding + border + margin 怪异盒模型（IE盒子模型）：怪异盒大小的计算公式：width(content + padding + border) + ma
阅读全文
摘要：BFC 及清除浮动 答：BFC(block fromatting context): 块级格式化上下文，渲染出一个独立的容器，让内部元素不受外部影响 如何创建BFC 答： 1 float不为none 2 overflow不为visible 3 position 为absolute fixed 4 d
阅读全文
摘要：display none 与visibility none区别 共同点：都是控制元素的显示与隐藏 不同点：display隐藏不会占据空间， visibility会留出空间 css的重绘和回流（重排）（重绘不一定需要重排，重排必然会导致重） 1 解析html，生成DOM树 解析css 生成CSSOM树
阅读全文
摘要：css优先级的运算 答： !important(10000) > 行内样式(1000) > id选择器(100) > 类，伪类选择器(10) > 标签选择器，伪元素选择器（1）> *选择器（通配符、子选择器、相邻选择器等的。如: *、>、+） css的选择器 答：id选择器 类选择器 标签选择器 通
阅读全文
