irotoru的博客

Flex 是 Flexible Box 的缩写，意为 "弹性布局"，用于为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。行内元素也可以使用Flex布局。

不换行，但可设置宽高，类似文本中的 “块”。独占一行，宽度默认占满父容器，可设置宽高。不换行，宽度由内容决定，无法设置宽高。display属性值(用于元素性质的转换)用于水平排列元素（如按钮组、图片列表）。整个盒子隐藏(并释放文档流位置)

语法：float: right/left/none;。作用：浮动元素会脱离标准流（简称：脱标），在标准流中不占位置浮动元素无法通过margin实现水平居中，因为浮动生效的权力更大。

文章主要介绍了网页布局中的三种流：标准流、浮动流和定位流。标准流是浏览器默认的排版规则，块级元素垂直排列，行内元素水平排列。浮动流通过float属性让块级元素水平排列，浮动元素会脱离文档流但仍受父元素约束。定位流通过position属性实现元素定位，包括相对定位（relative）、绝对定位（absolute）和固定定位（fixed），分别用于相对于自身、父元素或浏览器窗口进行定位。每种定位方式都有其特点和应用场景，如相对定位不脱离文档流，绝对定位完全脱离文档流，固定定位则固定在浏览器窗口的特定位置。

Emmet语法是一种用于快速生成HTML和CSS代码的工具，通过简写形式显著提高编码效率。它支持多种功能，包括基础标签生成、类选择器生成、ID选择器生成、复合属性生成、同级元素生成、父子元素生成、重复元素生成、内容填充生成、数字序列生成、CSS属性简写、多属性组合生成以及内容递增扩展。

【代码】CSS——基础样式练习。

它通过特定的符号来明确元素之间的父子关系，相比后代选择器，子代选择器的选择范围更精准，只针对直接子元素生效。后代选择器允许你选择某个元素内的所有后代元素（包括子元素、孙元素等，无论嵌套多深）。这种选择器利用了 HTML 文档的树形结构，通过指定祖先元素和后代元素，精准定位到符合要求的元素并应用样式。这意味着只要目标元素和参考元素处于同一层级，并且目标元素在参考元素之后，就会被选择器选中。交集选择器也被叫做复合选择器，它把多个选择器组合起来，从而选择同时满足这些选择器条件的元素。/* 样式规则 */

CSS（cascading style sheets，层叠样式表单）简称为样式表，是用于（增强）控制网页样式，并允许将样式信息与网页内容分离的一种标记性语言。简单用房子比喻来说，HTML是毛坯房，CSS就是给房子装修。