Html 在网格中添加链接后更改卡的大小

我制作了grid gallery，我需要添加所有卡片的链接，但当我添加标签时，整个卡片的大小会发生变化。我需要持有卡的大小，并与链接整个地区。我可以在卡片上添加链接而不改变大小，但会有链接只是文字，我需要整个卡片。我试图改变链接的大小，但什么也没发生

。 .

.饲料{ 显示：网格； 网格模板列：重复12,1fr； 网格自动行：350px； 栅隙：16px； 保证金：40px 0px 40px 0px； } .card_类别{ 字体大小：16px； 线高：18px； 字号：700； 颜色：fff； 保证金：0； } .card_title{ 字体大小：24px； 线高：32px； 字体大小：400； 颜色：fff； 利润率：10px0； } 对开本{ 填充物：5%10%； } 卡塔先生{ 背景尺寸：封面； 背景重复：无重复； 背景位置：中心； 边界半径：5px； 显示器：flex； 弯曲方向：立柱； 证明内容：柔性端； 填充：20px； 过渡：全部。3秒轻松； } 卡塔：停下来{ 光标：指针； 盒影：0 30px 18px-8px rgba0,0,0,0.1； 变换：scale1.02； } 卡塔：N-child1{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child2{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：第N-child3页{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：第N-child4页{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child5{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child6{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child7{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child8{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child9{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child1，：N-child6，：N-child7{ 格线柱起点：跨度6； } 卡塔：N-child2，：N-child3，：N-child4，：N-child5，：N-child8，：N-child9{ 格线柱起点：跨度3； } @媒体屏幕和最大宽度：1068px{ 卡塔：第N个孩子{ 格线柱起点：跨度12； } }

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

---

我认为propper的方法不是将div放在标记内，而是为标记提供必要的类。在你的c 如果它是class=karta

请看我的代码片段中的示例。我把与班级的联系放在首位

.饲料{ 显示：网格； 网格模板列：重复12,1fr； 网格自动行：350px； 栅隙：16px； 保证金：40px 0px 40px 0px； } .card_类别{ 字体大小：16px； 线高：18px； 字号：700； 颜色：fff； 保证金：0； } .card_title{ 字体大小：24px； 线高：32px； 字体大小：400； 颜色：fff； 利润率：10px0； } 对开本{ 填充物：5%10%； } 卡塔先生{ 背景尺寸：封面； 背景重复：无重复； 背景位置：中心； 边界半径：5px； 显示器：flex； 弯曲方向：立柱； 证明内容：柔性端； 填充：20px； 过渡：全部。3秒轻松； } 卡塔：停下来{ 光标：指针； 盒影：0 30px 18px-8px rgba0,0,0,0.1； 变换：scale1.02； } 卡塔：N-child1{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child2{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：第N-child3页{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：第N-child4页{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child5{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child6{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child7{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child8{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child9{ 背景图像：线性梯度 归根结底， rgba10,10,10,0%， rgba10,10,10,0 50%， rgba10,10,10,0 100%，url'https://images.unsplash.com/photo-1579703788936-06e79a4cce27?ixlib=rb-1.2.1&auto=格式和配合=裁剪&w=584&q=80'； } 卡塔：N-child1，：N-child6，：N-child7{ 格线柱起点：跨度6； } 卡塔：N-child2，：N-child3，：N-child4，：N-child5，：N-child8，：N-child9{ 格线柱起点：跨度3； } @媒体屏幕和最大宽度：1068px{ 卡塔：第N个孩子{ 格线柱起点：跨度12； } }

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失

旅行

在城市中迷失