那些记不住的css

文本css

• text-align：center

就是word里面的文本水平布局方式，可继承，是指在文本所能显示的环境中(即与父元素有关)

left：right：center：start：(如果内容方向是左至右，则等于left，反之则为right) end：justify：(文字向两侧对齐，对最后一行无效)

• 超出省略号

     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
  

以下为css布局的几种方式(同级，根据情况选择)

标准流（从上到下的块元素安排，从左到右的行内元素安排）、float、position(static，relative，absolute，fixed，sticky)、flex、grid

flex

Flex弹性盒模型的优势在于只需声明布局应该具有的⾏为，⽽不需要给出具体的实现⽅式，浏览器负责完成实际布局，当布局涉及到不定宽度，分布对⻬的场景时，就要优先考虑弹性盒布局。

容器默认存在两个轴：主轴（main axis）和与主轴垂直的垂直轴（cross axis），默认主轴是水平的。
父元素：display:flex;开启flex布局；以下均在父元素内设置

• flex-direction: row | row-reverse | column | column-reverse; 来确定主轴方位，默认为水平轴。

• flex-wrap：nowrap | wrap | wrap-reverse; 容器内元素是否可以换行；（nowrap 不换行，宽度不够时子项目会变小；wrap-reverse换行但是出现在原始行上方）

• flex-flow: < flex-direction> < flex-wrap>;前两个的简写方式。

• justify-content: flex-start | flex-end | center | space-between | space-around;元素在主轴的对齐方式
  

• align-items: flex-start | flex-end | center | baseline | stretch;元素在交叉轴上的对齐方式
  

• align-content: flex-start | flex-end | center | space-between | space-around | stretch;
  当 flex-wrap 设置为 wrap 时，容器可能会出现多条轴线，这时就需要去设置多条轴线之间的对齐方式。（效果：有多行项目时，确定每行项目之间的距离）
  
  以下为子元素的属性：

• order 用来指定项目的排列顺序。数值越小，排列越靠前，默认为0，可以为负数。

• flex-grow 属性定义项目的相对放大比例，默认为0，即如果存在剩余空间时也不放大。如果所有项目的flex-grow属性都为1，则它们将等分剩余空间（如果有的话）。如果一个项目的flex-grow属性为2，其他项目都为1，则前者占据的剩余空间将比其他项多一倍。

• flex-shrink 属性定义了项目的相对缩小比例，默认为1，即如果空间不足，该项目将缩小。如果所有项目的flex-shrink属性都为1，当空间不足时，都将等比例缩小。如果一个项目的flex-shrink属性为0，其他项目都为1，则空间不足时，前者不缩小。

• flex-basis 子项占据的宽度按优先级来是basis>width>auto，它定义了在分配多余空间之前，项目占据的主轴空间。它可以设为跟width或height属性一样的值（比如350px），则项目将占据固定空间，而不是发生grow或shrink。

• flex 是flex-grow, flex-shrink 和 flex-basis的简写，默认值为0 1 auto。后两个属性可选。写成flex:1，则flex-grow从默认的0变为1，项目变弹性，可伸可缩；

• align-self 允许单个项目有与其他项目不一样的对齐方式，可覆盖父元素的align-items属性，选项同align-items

颜色

rgb颜色(0,0,0)黑色，(255,255,255)白色
rgba最后一个的0表示全透明，1表示完全不透明，0.5可写成.5

transparent关键字用作rgba(0, 0, 0, 0)的快捷方式，它表示完全透明,它是background-color属性的默认值

currentColor 表示当前的颜色。如果没有指定，就会从父容器继承的文本颜色,该属性在SVG中使用时很方便，可以将指定的填充或描边颜色设置为currentColor，以确保SVG颜色与其父级的文本颜色匹配。

Hex即十六进制颜色值，不区分大小写，如果每两位的值相同可以使用 3 个值（每种颜色一个）来缩短十六进制值。

hsl颜色（x,y,z）
x是在颜色转盘的度数（0-360），y是饱和度（1鲜艳，0灰色），z亮度（0黑，1白）
黑色hsl(0,0,0)