grid布局和伪类

本文参照的哔哩哔哩博主记的笔记grid网格布局真香，比flex方便太多了，grid-template-columns用法_哔哩哔哩_bilibili

其次该博主自己的详细介绍grid笔记如下：grid网格布局，比flex方便太多了，介绍几种常用的grid布局属性_grid布局,子元素独占一行-优快云博客

1.原始写法

首先最原始的写法如下！grid+列样式才会有效果

2.固定某列的宽度

其次如果想固定某列的宽度如下：

3.让第二列占两份的宽度

想让第二列占两份的宽度如下：

4.简写

5.常用写法

6.自适应

7.宽度或高度合并

效果

8.伪类介绍

看博主css伪类和伪元素 一分钟完全掌握_哔哩哔哩_bilibili记的笔记

伪类可以拼接

还可以伪类+伪元素【不支持伪元素链式写法！】

效果

伪类大全

常用

区分

伪元素大全