ZiuChen.github.io/assets/note_CSS.md.447bc3ae.lean.js

import{_ as s,o as n,c as a,a as l}from"./app.b07fc07d.js";const e="/assets/BFC-1.ed3fcfd0.jpg",p="/assets/BFC-2.3c4a8bbc.jpg",o="/assets/BFC-3.7daed619.jpg",c="/assets/BFC-4.b58515a7.jpg",A=JSON.parse('{"title":"CSS基础","description":"","frontmatter":{"editLink":false},"headers":[{"level":2,"title":"文本样式(text)","slug":"文本样式-text","link":"#文本样式-text","children":[{"level":3,"title":"text-align（重要）","slug":"text-align-重要","link":"#text-align-重要","children":[]},{"level":3,"title":"letter-spacing word-spacing（了解）","slug":"letter-spacing-word-spacing-了解","link":"#letter-spacing-word-spacing-了解","children":[]}]},{"level":2,"title":"字体样式(font)","slug":"字体样式-font","link":"#字体样式-font","children":[{"level":3,"title":"font-size","slug":"font-size","link":"#font-size","children":[]},{"level":3,"title":"font-family（了解）","slug":"font-family-了解","link":"#font-family-了解","children":[]},{"level":3,"title":"font-weight（重要）","slug":"font-weight-重要","link":"#font-weight-重要","children":[]},{"level":3,"title":"font-style（了解）","slug":"font-style-了解","link":"#font-style-了解","children":[]},{"level":3,"title":"font-variant（了解）","slug":"font-variant-了解","link":"#font-variant-了解","children":[]},{"level":3,"title":"line-height（重要）","slug":"line-height-重要","link":"#line-height-重要","children":[]},{"level":3,"title":"font 缩写属性","slug":"font-缩写属性","link":"#font-缩写属性","children":[]}]},{"level":2,"title":"CSS选择器","slug":"css选择器","link":"#css选择器","children":[{"level":3,"title":"后代选择器","slug":"后代选择器","link":"#后代选择器","children":[]},{"level":3,"title":"直接子代选择器","slug":"直接子代选择器","link":"#直接子代选择器","children":[]},{"level":3,"title":"兄弟选择器","slug":"兄弟选择器","link":"#兄弟选择器","children":[]},{"level":3,"title":"选择器组","slug":"选择器组","link":"#选择器组","children":[]},{"level":3,"title":"伪类","slug":"伪类","link":"#伪类","children":[]},{"level":3,"title":"结构伪类","slug":"结构伪类","link":"#结构伪类","children":[]},{"level":3,"title":"伪元素","slug":"伪元素","link":"#伪元素","children":[]}]},{"level":2,"title":"CSS特性（重要）","slug":"css特性-重要","link":"#css特性-重要","children":[{"level":3,"title":"属性的继承","slug":"属性的继承","link":"#属性的继承","children":[]},{"level":3,"title":"属性的层叠","slug":"属性的层叠","link":"#属性的层叠","children":[]},{"level":3,"title":"HTML元素的类型","slug":"html元素的类型","link":"#html元素的类型","children":[]}]},{"level":2,"title":"CSS技巧","slug":"css技巧","link":"#css技巧","children":[{"level":3,"title":"元素隐藏方法","slug":"元素隐藏方法","link":"#元素隐藏方法","children":[]},{"level":3,"title":"样式不生效","slug":"样式不生效","link":"#样式不生效","children":[]}]},{"level":2,"title":"CSS盒子模型","slug":"css盒子模型","link":"#css盒子模型","children":[{"level":3,"title":"内容 width / height","slug":"内容-width-height","link":"#内容-width-height","children":[]},{"level":3,"title":"内边距 padding","slug":"内边距-padding","link":"#内边距-padding","children":[]},{"level":3,"title":"边框 border","slug":"边框-border","link":"#边框-border","children":[]},{"level":3,"title":"外边距 margin","slug":"外边距-margin","link":"#外边距-margin","children":[]},{"level":3,"title":"额外知识点","slug":"额外知识点","link":"#额外知识点","children":[]},{"level":3,"title":"外轮廓 outline","slug":"外轮廓-outline","link":"#外轮廓-outline","children":[]},{"level":3,"title":"盒子阴影 box-shadow","slug":"盒子阴影-box-shadow","link":"#盒子阴影-box-shadow","children":[]},{"level":3,"title":"行内非替换元素的注意事项","slug":"行内非替换元素的注意事项","link":"#行内非替换元素的注意事项","children":[]}]},{"level":2,"title":"CSS元素定位","slug":"css元素定位","link":"#css元素定位","children":[{"level":3,"title":"标准流","slug":"标准流","link":"#标准流","children":[]},{"level":3,"title":"认识元素的定位","slug":"认识元素的定位","link":"#认识元素的定位","children":[]},{"level":3,"title":"position属性取值","slug":"position属性取值","link":"#position属性取值","children":[]},{"level":3,"title":"绝对定位元素的特点","slug":"绝对定位元素的特点","link":"#绝对定位元素的特点","children":[]},{"level":3,"title":"z-index解析","slug":"z-index解析","link":"#z-index解析","children":[]}]},{"level":2,"title":"浮动布局","slug":"浮动布局","link":"#浮动布局","children":[{"level":3,"title":"认识浮动布局","slug":"认识浮动布局","link":"#认识浮动布局","children":[]},{"level":3,"title":"浮动案例","slug":"浮动案例","link":"#浮动案例","children":[]},{"level":3,"title":"浮动规则","slug":"浮动规则","link":"#浮动规则","children":[]},{"level":3,"title":"通过清除浮动实现布局(TODO)","slug":"通过清除浮动实现布局-todo","link":"#通过清除浮动实现布局-todo","children":[]}]},{"level":2,"title":"Flex布局","slug":"flex布局","link":"#flex布局","children":[{"level":3,"title":"认识Flex布局","slug":"认识flex布局","link":"#认识flex布局","children":[]},{"level":3,"title":"flex布局的重要概念","slug":"flex布局的重要概念","link":"#flex布局的重要概念","children":[]},{"level":3,"title":"flex相关的属性","slug":"flex相关的属性","link":"#flex相关的属性","children":[]},{"level":3,"title":"案例：解决布局问题","slug":"案例-解决布局问题","link":"#案例-解决布局问题","children":[]}]},{"level":2,"title":"CSS中的函数","slug":"css中的函数","link":"#css中的函数","children":[{"level":3,"title":"var  变量","slug":"var-变量","link":"#var-变量","children":[]},{"level":3,"title":"calc 计算","slug":"calc-计算","link":"#calc-计算","children":[]},{"level":3,"title":"blur 高斯模糊","slug":"blur-高斯模糊","link":"#blur-高斯模糊","children":[]},{"level":3,"title":"gradient 颜色渐变","slug":"gradient-颜色渐变","link":"#gradient-颜色渐变","children":[]}]},{"level":2,"title":"CSS求值过程","slug":"css求值过程","link":"#css求值过程","children":[]},{"level":2,"title":"移动端开发","slug":"移动端开发","link":"#移动端开发","children":[]},{"level":2,"title":"额外知识补充","slug":"额外知识补充","link":"#额外知识补充","children":[{"level":3,"title":"浏览器前缀","slug":"浏览器前缀","link":"#浏览器前缀","children":[]},{"level":3,"title":"深入理解BFC（重点）","slug":"深入理解bfc-重点","link":"#深入理解bfc-重点","children":[]},{"level":3,"title":"媒体查询","slug":"媒体查询","link":"#媒体查询","children":[]},{"level":3,"title":"link元素的使用","slug":"link元素的使用","link":"#link元素的使用","children":[]},{"level":3,"title":"CSS颜色的表示方式","slug":"css颜色的表示方式","link":"#css颜色的表示方式","children":[]},{"level":3,"title":"网络字体","slug":"网络字体","link":"#网络字体","children":[]},{"level":3,"title":"字体图标","slug":"字体图标","link":"#字体图标","children":[]},{"level":3,"title":"精灵图 雪碧图","slug":"精灵图-雪碧图","link":"#精灵图-雪碧图","children":[]},{"level":3,"title":"white-space","slug":"white-space","link":"#white-space","children":[]},{"level":3,"title":"text-overflow","slug":"text-overflow","link":"#text-overflow","children":[]},{"level":3,"title":"水平垂直居中方案","slug":"水平垂直居中方案","link":"#水平垂直居中方案","children":[]},{"level":3,"title":"内联元素居中布局","slug":"内联元素居中布局","link":"#内联元素居中布局","children":[]},{"level":3,"title":"块级元素居中布局","slug":"块级元素居中布局","link":"#块级元素居中布局","children":[]}]},{"level":2,"title":"HTML5新增内容","slug":"html5新增内容","link":"#html5新增内容","children":[{"level":3,"title":"语义化元素","slug":"语义化元素","link":"#语义化元素","children":[]},{"level":3,"title":"video标签","slug":"video标签","link":"#video标签","children":[]},{"level":3,"title":"audio标签","slug":"audio标签","link":"#audio标签","children":[]},{"level":3,"title":"input元素","slug":"input元素","link":"#input元素","children":[]},{"level":3,"title":"全局新增属性 data-*","slug":"全局新增属性-data","link":"#全局新增属性-data","children":[]}]}],"relativePath":"note/CSS.md","lastUpdated":1673345737000}'),t={name:"note/CSS.md"},r=l("",533),i=[r];function d(D,y,F,C,u,b){return n(),a("div",null,i)}const m=s(t,[["render",d]]);export{A as __pageData,m as default};