CSS设置行内元素和块级元素的水平居中、垂直居中

  • Post author:
  • Post category:其他



什么叫行内元素(内联元素)?

常见的span、a、lable、strong、b等html标签都是行内元素

默认情况下,行内元素均无法设置宽度、高度、上下方向margin的外边距等

一般在css中添加属性:

display:inline //这时设置成了内联元素


什么叫块级元素?

常见的div、p、li、h1、h2、h3、h4等html标签都是块级元素

一般在css中添加属性:

display:block //这时设置成了块级元素

1.CSS设置

行内元素

的水平居中:

text-align:center 

2.CSS设置

行内元素

的垂直居中:

height:30px;
line-height:30px

3.既要水平居中又要垂直居中:

text-align:center;
height:30px;
line-height:30px

4.CSS设置

块级元素

的水平居中和垂直居中:关键代码:

margin:0 auto; 

块级元素的居中,样式比较灵活,具体详情见:

https://blog.csdn.net/zuo_er_lyf/article/details/87369984



块级元素水平垂直居中方法



版权声明:本文为zuo_er_lyf原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。