【凡哥教程第三讲作业】岁月的故事（计算令贴子居中）

雨声

雨声

@花简静
交作业，静宝调上下，在哪里呢

凡哥

效果完美

雨声

凡哥 发表于 2024-7-24 21:09
效果完美

晚上好凡凡老师，谢谢鼓励

安静听雨

美图居中，效果好好。出手就两篇作业，给力。

花简静

雨声 发表于 2024-7-24 20:04
@花简静
交作业，静宝调上下，在哪里呢

亲爱的声妞，调哪里上下？
这一句里面：
margin: 230px 0 30px calc(50% - 990px);
230px是上，可令贴子不遮头像
0是右
30px是下：不占评分地方
calc(50% - 990px);这一串是左边。算好了令贴子居中。。


第三讲凡哥原贴描述如下：
margin 属性我们设置了四个值，
第一个是 230px，指上外边距，说的是 id="mama" 的 div 上边缘的外边距是 230px，这么设置的作用是让帖子容器的上边缘留空230个像素，以便令帖子不覆盖发帖用户的头像；
第二个值是 0，是右变的外边距，值为0才能确保最后一个值即左外边距的设置不受挤占、影响；
第三个是 30px，指下边的外边距，这样帖子和底部也拉开一定距离，不会紧贴着评分区域而导致评委评分困难；
第四个是左边的外边距，它用上了CSS的计算函数 calc(...)，小括号里面的是算式，加减乘除符号两头一定要留有一个空格，然后，算式里面的 50% 指左外边距的值是 50%，但要减去 730px，这样帖子就在水平方向绝对居中。

云笛

很高兴又见着声妞来了，晚上我一直挂版没看帖子，刚空下来刷新看见你新作了

云笛

我看了凡老师教程，还云里雾里没搞清楚呢，你都已经交作业了

雨声

花简静 发表于 2024-7-24 22:14
亲爱的声妞，调哪里上下？
这一句里面：
margin: 230px 0 30px calc(50% - 990px);

好的似乎明白了些，抱抱静妞

雨声

云笛 发表于 2024-7-24 22:19
很高兴又见着声妞来了，晚上我一直挂版没看帖子，刚空下来刷新看见你新作了 ...

哈哈，见到笛宝真是开心啊，来来抱一抱