css样式学习记录

display:flex  弹性布局默认在一行（主轴显示）

padding：0   有的时候你发现无论怎么样都会由边距，可以试一下这个

line-height:1.2   可以拿来设置行高

flex-wrap: wrap  超出宽度时文字可以自动换行

object-fit: cover   对元素进行缩放，用于img

position:flex   将元素固定在屏幕的一个区域

display :block;  将元素变成块级

align-items: center;   垂直居中

display: block;  可以取消img在div中的留白

display: block; 可以取消

position: relative 为内部绝对定位元素（如插画、表单）提供基准

position: absolute; /* 脱离文档流，相对于根容器定位 */

z-index: 1 确保它在最底层，不遮挡其他内容

text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); /* 文字阴影（增强可读性） */

position: fixed;   脱离文档流，固定在浏览器的某个位置

小技巧

有的时候我们想要让子元素定位在父元素的区域中的自定义的位置，有个非常好的属性可以配合使用

给父元素  position:relative;   //作为子元素的定位基准

再给子元素设置 position: absolute 并配合 top: 0 和 left: 0 固定在左上角