css中重要的是盒子模型，盒子的宽度和高度计算方式如下：

• border width + padding-left + padding-right + width = div占的宽度
• border height + padding-top + padding-bottom + height = div占的高度

杂碎知识点集合

for in和正常for循环的区别

在遍历数组时，正常的 for 循环通常比 for...in 循环更适合。虽然 for...in 循环可以用于遍历数组，但它有一些潜在的问题和限制。

1.flex基础点

---什么是容器，什么是项目，什么是主轴，什么是侧轴？

---项目永远排列在主轴的正方向上

---flex分新旧两个版本

-webkit-box

-webkit-flex / flex

作为快 7 年的前端开发，有时会参与公司的招人面试，面试的对象主要是初中级前端人员。一般会先围绕项目经历问一些问题，随后就问一些前端基础知识。下面就谈谈个人常问的一些基础技术问题。

CSS

响应式布局：只需要开发一套代码，只需要一套代码使页面适应不同的屏幕。

在CSS中，flex是一种弹性布局模型，用于创建灵活的、可响应的布局。使用flex布局可以轻松地实现以下功能：

rem 是 CSS3 新增的一个相对单位，相对于根节点(html)字体大小的值，r 就是 root
例如：html{font-size:10px} 则 2rem=20px
通过它就可以做到只修改根元素的大小，就能成比例地调整所有的字体大小，只依赖 html
字体的大小

# 用flex 实现圣杯布局和双飞翼布局一样的效果？？？不是很强但是很骚

## 引言：Flex布局的魅力与挑战

在Web前端的世界里，布局设计一直是开发者们的热议话题。圣杯布局（Holy Grail Layout）和双飞翼布局（Double Flying Wing Layout）作为经典的三栏布局模式，长久以来一直备受推崇。然而，随着CSS Flexbox（弹性盒布局模型）的普及，我们有机会用一种更简洁、更直观的方式来实现这两种布局效果。本文将带领大家一起探索如何运用Flex布局实现圣杯布局和双飞翼布局，感受其既不是特别复杂却相当巧妙的一面。

布局相关题

介绍一下 flex 布局，flex:1是哪几个属性的缩写