前端面试精简版：CSS布局技巧与Cookie、Session解析

“前端基础面试题，适合前端零基础同学” 这篇资源主要涵盖了前端开发的一些基础面试题，适合那些刚开始学习前端的同学。以下是其中涉及到的主要知识点： 1. **CSS布局技术**： - **浮动布局（Float）**：在1.1和1.2中提到了`float:left`来实现左边定宽，右边自适应或左右两边定宽，中间自适应的布局。浮动元素会脱离正常文档流，使得其他元素可以围绕它排列。 - **计算属性（Calc）**：`calc()`用于动态计算长度、频率、角度、时间、百分比、数值等。在1.2中使用`calc(100% - 120px)`来确定右侧元素的宽度。 - **BFC（块级格式化上下文）**：在1.2的圣杯布局中提到，通过创建BFC可以实现特定的布局效果，例如用margin负值法解决内部元素的宽度问题。 - **Flex布局**：在1.2和1.3中，通过`display:flex`实现元素的灵活布局，可以轻松实现左右居中或两侧定宽，中间自适应的效果。 - **定位布局（Position）**：结合`transform`可以实现不定宽块状元素的居中，通过设置`position`和调整`transform: translateX()`可以调整元素位置。 2. **居中对齐**： - **行内元素居中**：通过设置`text-align:center`可以使行内元素在容器内水平居中。 - **定宽块状元素居中**：设置`margin: 0 auto`可以使定宽的块状元素在父容器中水平居中。 - **不定宽块状元素居中**：可以使用表格布局、定位布局或者Flex布局来实现不定宽元素的居中。 3. **Cookie与Session**： - **Cookie**：是服务器存储在客户端浏览器上的文本信息，通常用来保存用户的状态信息，如登录状态、购物车数据等。每次客户端向服务器发送请求时，都会将Cookie一并发送。 - **Session**：是服务器端存储用户会话信息的一种方式，相比Cookie更安全，因为数据存储在服务器端。服务器通过Session ID来识别每个用户的会话，这个ID会在Cookie中传递。如果浏览器禁用了Cookie，Session可能无法正常工作。 这些知识点是前端开发者需要掌握的基础技能，对于准备面试或初学者来说尤其重要。了解和熟练掌握这些布局技巧以及状态管理工具，能够帮助开发者构建出更加高效和响应式的网页应用。