css中bottom是什么意思

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

CSS中的bottom属性是用来设置元素底部相对于其父元素底部的位置的。它的语法如下:元素选择器{ bottom: 像素值/百分比值/自动/initial/inherit; } 其中,“自动”表示元素

CSS中的bottom属性是用来设置元素底部相对于其父元素底部的位置的。

它的语法如下:

元素选择器{
  bottom: 像素值/百分比值/自动/initial/inherit;
} 

其中,“自动”表示元素底部将会跟随上一个非静态(非position:static)定位元素的底部,如果没有相对定位的元素,则bottom属性将自动设置为0。

如果使用像素值或百分比值,则元素底部会与父元素底部之间留有指定的距离。例如:

div{
  position: relative;
  bottom: 50px;
} 

这会将div元素的底部向上移动50像素,使它距离父元素底部有50像素的距离。

同样,如果使用百分比值,则目标元素的底部会向上移动相应的百分比,例如:

div{
  position: relative;
  bottom: 30%;
} 

这个例子会将div元素的底部向上移动,使它相对于父元素底部向上30%的高度。

最后,还有两个特殊值:initial和inherit。其中,“initial”表示bottom属性将被设置为其默认值,即“auto”;而“inherit”表示bottom属性的值将从其父元素继承。

总之,在CSS中使用bottom属性可以调整元素底部的位置,让它相对于其父元素底部向上或向下移动。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中bottom是什么意思

粉丝

0

关注

0

收藏

0

已有0次打赏