用html做b站首页,前端练习-B站1

本文记录了作者使用HTML制作B站首页的练习过程,遇到的布局问题包括子元素导致的导航栏混乱、浮动元素引起的父元素高度塌陷以及元素标签错误造成的样式问题。通过学习和实践,作者理解了前端代码的编写规范,如NEC规范,强调了HTML结构顺序的重要性,并计划继续深化练习。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

本周做了B站第一部分的练习,并利用工作的间隙做了一部分优快云首页的模仿练习,自己的体会是,布局和基本样式没有太大问题,但是熟练程度有待进一步提高,主要是死磕一个比较成熟的案例,B站课程练习算是一个开始,之前做了很多小练习,是张开眼睛看,帮我打开前端的HTML、CSS的世界,下面不仅要看清楚想清楚,而且要自己动手做出来。

练习B站的过程主要遇到以下问题:

问题1

因为游戏中心插入子元素div,被撑开,导致导航栏元素位置混乱

解决1

父元素-游戏中心 position: relative;子元素-详情detail position: absolute;绝对定位脱离文档流,不占据原来的位置。

6e59daa3ae5f

问题1

问题2

子元素设置浮动,父元素高度塌陷

解决2

.clearfix:after{

content:"";

display:block;

height:0;

clear:both

}

6e59daa3ae5f

image.png

问题3

和老

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值