CSS|青训营笔记
这是我参与「第四届青训营 」笔记创作活动的的第1天。 CSS 是用来定义页面元素的样式，想要一个好看的页面是必不可少的。 包括三种方法：外链、嵌入、内联（其中外链是最为推荐的方法，其他根据场景来选用） 选择器 1. 通配选择器-----*{} 2. 标签选择器-----label {} 3.id选择器------#id {} 4.类选择器------.class {} 5.属性选择器----通过属性来选择 6.伪类选择器-----分为状态伪类和结构伪类两种设置方式 ... 属性选择器及伪类选择器示例：
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
a {
color:red;
}
a[href^="#"] {
color: blue;
}
a[href$=".jpg"]{
font-size: 20px;
}
li:first-child {
color: palevioletred;
}
li:last-child {
border: 1px solid red;
background-color: palegoldenrod;
}
</style>
</head>
<body>
<a href="#top">属性选择器</a>
<a href="a.jpg">属性选择器</a>
<a href="#last">属性选择器</a>
<div>
<ul>伪类选择器
<li>first</li>
<li>second</li>
<li>third</li>
<li>last</li>
</ul>
</div>
</body>
</html>
色彩有两种设置方式1.RGB（#00红 00绿 00蓝）2.HSL（色相，饱和度，亮度） white-space 空白符----属性--1.normal多个空格和换行显示为一个 2.nowrap强制不换行 3.pre 显示所有 4.pre-wrap 自动换行 5.pre-line 空格合并，保留换行 布局相关技术：常规流、浮动、绝对定位 常规流包括：行级（IFC）、块级（BFC）、表格布局、FlexBox、Grid布局 IFC内排版规则：一行内摆放，自动换行，能避开浮动元素 BFC内排版规则：独占一行， 可设置宽高，不会和浮动元素重叠 FlexBox-----display：flex； flax-direction-----排放流向 justify-content-----沿主轴的对齐方式 align-item----沿侧轴的对齐方式 align-self-----对某一特殊元素设置单独的对齐方式 order------排序方式 flexibility内有三个属性可以将内容按不同比例分配 flex-grow：有剩余空间时 flex-shrink：空间不足时 flex-basis 三个属性可以压缩成一个flex书写
标题：彻底理解CSS Flexbox布局，看这一篇就够了！ - 掘金
