心得:这一周我们学习了css布局中的三大重点:盒子模型,浮动和定位,只有把这三个重点学号并灵活贯通的使用 才能更好,更便利的设计和美化页面。
在这周中,我和小组成员一起分工合作,共同的学习和制作了华为全屋智能的官网,在制作过程中,也遇到了不少的问题,一起和伙伴一点点解决,废寝忘食,也算是体验到了另一种快乐,当一步步试错并成功把问题解决后,心里会由衷的感到高兴.在和团队的合作中,也能发现自己在敲代码过程中的不规范或者不够简单的代码.在实操的过程中也对知识点进行了复习,实际应用这些知识点让我真正的掌握的关于html开发的一些能力.在接下来的学习中我相信可以收获更多,并且和团队做出更好的作品.
部分知识点:
1. 图片或者文本溢出可以用overflow
auto溢出自动出现滚动条
hidden溢出自动隐藏
scroll无论溢出是否都有滚动条
2.特别需要注意:a元素的样式要直接作用于a元素
3.伪元素选择器
before伪元素作为目标元素的第一个子元素存在
after伪元素作为目标元素的最后一个子元素存在
content伪元素的内容是必须要设置的
4.相对定位需要注意:
相对定位是相对于元素的原本位置进行定位的,而绝对定位是相对于浏览器窗口进行定位的。相对定位的元素不会脱离标准文档流,而绝对定位的元素会脱离标准文档流。所以原本的位置会被保留。也不会影响其他元素的位置。
5.绝对定位需要注意的是:
绝对定位有2种情况:
1.有父元素,但父元素未设置position属性,那么设置绝对定位的参照是整个文档
2.有父元素,且父元素设置position属性为relative,那么设置绝对定位的参照是父元素的位置