想要块级元素居右往往设置 margin-right: 0 属性是行不通的,下面微点阅读小编介绍五种方法,不同场景适用不同方法,感兴趣的朋友跟随小编一起看看吧
HTML 如下:
1 2 3 |
|
想要块级元素居右往往设置 margin-right: 0
属性是行不通的
下面介绍五种方法,不同场景适用不同方法
使用 margin 属性
1 2 3 |
|
将 margin-left
设为 auto
后, 元素左边的 margin
会被尽可能的撑大, 所以自然就把元素挤到右边去了
使用 position 属性
1 2 3 4 5 6 7 |
|
使用 position
定位, 绝对能把元素放到右边去.
使用 float 属性
1 2 3 |
|
使用 float
浮动将元素浮动到右边.
使用 text-align 属性
1 2 3 4 5 6 |
|
将块设为行内元素,然后父元素使用 text-align: right;
是块到右边.
使用 flex 属性
1 2 3 4 |
|
将父元素变为弹性容器, 然后将 justify-content
设为 flex-end
, 那么容器中的弹性元素会从右开始排列.
到此这篇关于CSS 实现块级元素靠右的方法的文章就介绍到这了,希望可以对你有所帮助。
来源:微点阅读 https://www.weidianyuedu.com