在本文中，您将学习使用网格自动放置规则来使用网格元素。您可以使用 auto 作为网格上的属性值，因为 auto 使容器能够根据行或列中项目的内容自定义其大小。
句法：
grid-template-rows : auto
grid-template-columns: auto适当的价值：
- auto ：行或列的大小由容器的大小以及行或列中项目的内容大小决定。
示例 1：对 Row 和 Column 都使用auto。
HTML
CSS | grid Property
Welcome to GFG
This tutorial is on CSS grid property
Welcome to GeeksforGeeks
Complete Portal for Geeky
Courses
Data Structure and Algorithm
Competitive Programming
Operating System
DBMS
HTML
CSS | grid Property
Welcome to GeekdforGeeks
This tutorial is on CSS grid property
Complete Portal for Geeky
Courses
Data Structure and Algorithm
Competitive Programming,
If you are looking to conquer your coding skills,
we are here with our Competitive Programming Live Course.
Operating System
DBMS, Database management system (DBMS) is a
collection of interrelated data and a set of
programs to access those data
输出：
示例 2：
HTML
CSS | grid Property
Welcome to GeekdforGeeks
This tutorial is on CSS grid property
Complete Portal for Geeky
Courses
Data Structure and Algorithm
Competitive Programming,
If you are looking to conquer your coding skills,
we are here with our Competitive Programming Live Course.
Operating System
DBMS, Database management system (DBMS) is a
collection of interrelated data and a set of
programs to access those data
输出：
在上面的示例中，网格的第一行和第三行大小是固定的，第二行大小是自动的。因此，由于固定大小，文本从第 3 行溢出，但由于 auto 属性值而没有发生在第 2 行。
支持的浏览器： CSS 支持的浏览器 | grid auto 属性如下：
- 谷歌浏览器 57
- 火狐 52
- 边缘 16
- 野生动物园 10
- 歌剧 44