学习H5仿制网站时遇到的问题

时间:2023-03-09 19:57:58
学习H5仿制网站时遇到的问题

学习H5的第二周,开始仿制网站,在本过程中也发现了自己存在的更多问题。

1.TOP块:在制作top中,遇到的第一个问题,一旦top左右的背景色不同该怎样去调整

解决方式:建立两个div取代一个div

学习H5仿制网站时遇到的问题

学习H5仿制网站时遇到的问题

2.浮动排列使用的并不熟练:

使用浮动时,总是出现各个块乱飘的现象

解决方法,通过使用定位,强行定位每个块的位置,但缺点是响应式并不好做,而且感觉在代码上数量太多

学习H5仿制网站时遇到的问题

学习H5仿制网站时遇到的问题

3.在部分z轴问题上处理不大明白

z轴问题是通过定位之后

利用z-index属性调整各个块的z轴先后

但是在既有浮动也有定位的两个块,好像并不能你用Z轴变换

4.对于隐藏块的hover事件:

最开始对于hidden属性并不理解,所以不喜欢使用hidden通过隐藏再拉长显示

取而代之使用display:none  hover使用display:block

但是后来学习过渡,发现display并不能使用过渡属性

学习H5仿制网站时遇到的问题

学习H5仿制网站时遇到的问题

5.对于中间块,过分的使用了div标签,导致写div的css时出现了权重冲突

在无法修改的情况下,只能给每个div再加id属性

学习H5仿制网站时遇到的问题

以上是本周遇到的比较常见的问题以及部分解决办法