如何使用css，把div设置为一个椭圆容器,在做html页面开发时，我们一般都是使用div来做容器的，如果你需要一个椭圆形的容器，我们可以使用div来实现的，下面来看一下。......
css position属性的使用方法
来源：互联网
2023-03-16 19:16:30 325
本经验介绍在编写css样式时，如何通过position属性控制元素如何定位，以及和父元素的关系。
工具/原料
- vscode
方法/步骤
首先，我们实现一个简单的html页面如图，外层class为padiv。内层有chdiv1和chdiv2。
我们给第二个子元素chdiv2添加position: relative属性。然后top和left会随之生效，如图所示。
元素仍然在文档流内，relative是相对应该在的位置移动。
如果选择position为absolute，其会脱离文档流（父元素不再保留其位置）。但是其定位是相对页面定位的，如图chdiv2会定位到页面左上角。
如果使用fixed，则该元素是相对浏览器窗口定位的。如图定位在窗口右下角。
如果使用sticky，同时需要指定top/left/bottom/right其中的1~2个。当页面滚动，元素进入不可见区域时，元素会表现得像fixed一样。
position的默认属性值是static，即元素就在文档流内原本位置，此时left top right bottom属性不会生效。
position属性可以任意的组合嵌套。如下图是两层relative，也可以一层fixed一层relative等等。
position还有一个最普通的属性是inherit，就是继承父节点。如图，子节点和父节点一样为fixed。
注意事项
- 如果遇到问题，可以在下面提出疑问。
- sticky属性值并不是所有浏览器都支持。
以上方法由办公区教程网编辑摘抄自百度经验可供大家参考！
上一篇：js 动态添加html如何绑定事件 下一篇：html中如何使用span标签
相关文章
- 详细阅读
- 详细阅读
-
HTML5创作工具，MAKA 2.0史上最全操作指南详细阅读
HTML5创作工具，MAKA 2.0史上最全操作指南,超过15000种模板组合。还怕你没有发挥的空间吗？MAKA（中文：码卡）作为中国最早推出移动端卡片式交互模式的创新者，随着HTML5技术的日渐成熟......
2023-03-16 436 HTML
![HTML网页制作：[17]CSS常用样式字体及颜色属性](https://exp-picture.cdn.bcebos.com/ba274f598540102a99638a11b142a07aa110c5d4.jpg)