学会成长

目录 一、父元素（容器）属性 1. flex-direction：容器伸缩方向 2. flex-wrap：换行 3.flex-flow：同时设置 flex-direction 和 flex-wrap 属性的简写属性 4.justify-content：主轴对齐， 用来定义伸缩项目沿主轴线的对齐方式 5.align-items：侧轴对齐，伸缩项目行在侧轴上的对齐方式 6.align-content：对齐弹性线，往往要与换行同时应用，没有换行就不存在多行的情况 二、子元素（项目）属性 1...

二、边框属性 border-width:2px; /*边框的样式也叫线型*/ 边框样式： border-style:solid（实线）/double（双线）/dotted（点）/dashed（虚线）; border-color:red; ©—— © <div>—— </div>—— border-bottom:边框宽度边框风格边框颜色；底边框 border-left:边框宽度边框风格边框颜色；左边框 border-right:边框宽度边框风格边框颜色；右边框 .

1. 控制文字的样式 字体大小默认在浏览器下是16px，在谷歌浏览器下默认设置文字大小支持的最小是12px 9pt = 12px 2. font-family font-weight font-style font-size

盒模型规定了所有元素都拥有一个像盒子一样外形的东西，由border、margin、padding、content组成。 1. 标准盒模型： 宽度=左右margin+左右border+左右padding+width 高度=上下margin+上下border+上下padding+height 2. 怪异盒模型（在IE6下，当不对doctype进行定义时，会触发怪异盒模型）： 宽度=左右margin+content的width； 高度=上下margin+content的height； 3...

一、伪类选择器 1. 类型 link ：链接的初始状态； visited ：链接被访问过后的状态； hover ： 鼠标悬停（划过）时的状态； active ：鼠标激活的状态，即鼠标按下的状态； 2. 使用事项 当此4个状态联合使用的时候，需要按link->visited->hover->active的顺序，错误的顺序会使样式设置失效； 除了hover以外可以给其他标签使用，剩余的几个只能给a超链接使用； 伪类选择器有缓存问题； 二、选择器权重 css中使用四位表示权重：

一、基础概念 标准流（文档流）：标签默认在网页中显示的初始排版顺序； 浮动流：设置了float属性的标签； 二、使用 float: none/left/right； 目的：让标签脱离文档流，使原本竖向排列的标签横向排列； 三、注意事项 两个元素，第一个浮动了float: left，第二个没有浮动，浮动的元素会把没有浮动元素给覆盖掉; 两个元素，第一个没有浮动，第二个有浮动，两个元素的位置保持不变; 两个元素，都浮动，当整体宽度不够的时候，就会把第二个元素挤到下一行； 文本会默

一、分类 1.内部样式表 最好放在header标签内部，格式：<style type="text/css">css语句</style> 2. 外部样式表（同一个css样式表可以给多个html文件引用） link标签引入css文件：<link rel="stylesheet" type="text/css" href="css/style.css"> ① rel="stylesheet" ：关联样式表； ②type="text...

1. 属性 background-image：url()表示路径，显示原则： 图片<容器大小的时候，默认平铺； 图片>容器大小的时候，背景图显示不完整； 图片=容器大小的时候，背景图刚好显示完整; background-repeat：背景平铺属性 no-repeat：不平铺 repeat：平铺（默认值） repeat-x：水平平铺 repeat-y：垂直平铺 background-position：背景图位置属性 left、right、center、top

1. 相关属性 src: 图片路径 当前文件与图片文件在同一目录下，使用：图片文件名+扩展名； 当前文件与图片文件所处的文件夹在同一目录下，使用：文件夹名/目标文件全称+扩展名； width: 设置图片宽度信息； height: 设置图片高度信息； title: 提示信息，鼠标进入图片区域显示信息； alt: 提示信息，路径错误、加载失败、网速较慢的时候给予用户的提示； ...