尚硅谷新版Web前端HTML5+CSS3知识点集合篇【p69-p84】

最新推荐文章于 2024-01-20 16:39:42 发布

tudouzibututou

最新推荐文章于 2024-01-20 16:39:42 发布

阅读量244

点赞数

分类专栏：尚硅谷新版Web前端HTML5+CSS3教程

本文链接：https://blog.csdn.net/tudouzibututou/article/details/111499770

版权

本文详细介绍了HTML5和CSS3中的定位技术，包括静态、相对、绝对、固定和粘滞定位。解释了各种定位的特点，如相对定位不脱离文档流，绝对定位改变元素性质，固定定位参照浏览器视口，粘滞定位在特定位置固定。此外，还讲解了定位元素的布局、层级控制（z-index）以及字体、行高和文本对齐等相关样式知识。

摘要由CSDN通过智能技术生成

尚硅谷新版Web前端HTML5+CSS3全套基础教程完整版(初学者零基础入门)

p69
一、定位（position）
1.定位是一个更加高级的布局手段。
2.通过定位可以让元素摆放在页面的任意位置。
3.使用position属性来设置定位。
4.可选值：（1）static（默认值，元素是禁止的，没有开启定位）
（2）relative （开启元素的相对定位）（3）absolute（开启元素的绝对定位）（4） fixed（开启元素的固定定位）（5）sticky（开启元素的粘滞定位）

二、相对定位（relative）
1.当我们元素的position元素的属性值设置为relative则开启了元素的相对定位。
2.相对定位的特点：
-元素开启相对定位以后，如果不设置偏移量，元素不会发生任何变化。
-相对定位，是参照于元素在文档流中的位置进行定位的。
-相对定位，会提升元素的层级。
-相对定位不会使元素脱离文档流。
-相对定位不会改变元素的性质，块还是块，行内还是行内（没有脱离文档流）。
3.偏移量（offset）
-偏移量（offset），当元素开启了定位以后，可以通过偏移量来改变元素的位置。<