高度自适应的九宫格效果，CSS深入理解之absolute教程-慕课网

问答
评论
笔记
资料下载
代码

全部精华我要发布

li:after 里面的height:30px; 实现垂直居中，为什么是30px 与font-size有关系吗？

最赞回答 / 路过的小白成长ing

不是，height只是容器的高度，实现垂直居中的是absolute拉伸效果和magin:auto;

2 回答 1791 浏览

2023-12-08

屏幕自适应

已采纳回答 / 慕沐1559616

<...code...>這是第14行代碼，裏面規定了寬度高度都是33.3%

3 回答 1648 浏览

2017-09-12

九宫格的伪元素:after :before

已采纳回答 / 慕圣8800280

list

1 回答 938 浏览

2016-10-24

本节CSS代码全注释

最赞回答 / Nehpets

同时用了正常的解释和老师的天使爆裂理论<...code...>

7 回答 1581 浏览

2022-02-18

九宫格中文字的居中问题

已采纳回答 / Elvis_Nam

text-align:center;只能解决水平居中的问题。文字的垂直居中是通过设置文字行高值与容器高度值一样解决的，即：<...code...>

1 回答 1367 浏览

2016-08-23

如何往九宫格里填充html内容

最新回答 / 宇杰yvette

2 回答 1189 浏览

2020-12-31

请大神指教

最新回答 / HandMU

before和after是伪类，用于添加非重要内容或者布局辅助，如老师的案例中就是如此，before中content内容为空是一种用于，用于布局辅助，即该块为空内容占位块，最常见的作用是清除浮动。

1 回答 1005 浏览

2016-08-23

九宫格那个代码里面的 li为什么要加相对定位？

已采纳回答 / P妞酱酱

我认为是让.list:before和.list:after都相对其（设置了relative的元素）定位，这样才能控制各个九宫格里面的内容都相对各自的九宫格来定位。

5 回答 2741 浏览

2016-11-21

有些地方不太明白

最新回答 / aiwei笑

就近原则

1 回答 1208 浏览

2016-08-23

主要是after和before没有理解吧，你可以大致理解为有三层div最外面就是list一层，中间是list:before一层，最里面当然就是after的了最外面一层负责隔离，加上relative，把各个层给分割开来，因为我们知道absolute没把他们分开是会重叠在一起的，而且不加上relative会使得相对目前的窗口，那么你就只能看到一个大格子了中间那层就是老师讲的那样最里面的就是用来摆弄里面的文字，因为这里的布局在html都不怎么重要，所以选择了after和before的方法

2 回答 1376 浏览

2016-08-23

:before和:after这么神奇的

+ 我来回答回答最高可+2积分

2 回答 1362 浏览

2022-06-03

数字怎么就垂直居中了？

最新回答 / hey自然

height: 30px; font: 24px/30px 即行高也为30px, 从而实现该数字的垂直居中。

3 回答 1766 浏览

2016-08-23

全部我要发布

最热最新

只看我的

7. absolute与width和height 立即下载

7-4 高度自适应的九宫格效果