实现元素或图片的上下、左右居中的三种方法
效果图如下:
先设置父元素样式text-align: center,实现图片左右居中,给图片添加一个同级的span标签,设置宽度为零,高度100%,两者都设置display: inline-block; vertical-align: middle,即可实现图片上下居中,具体代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
实现元素或图片的上下、左右居中的三种方法
效果图如下:
先设置父元素样式text-align: center,实现图片左右居中,给图片添加一个同级的span标签,设置宽度为零,高度100%,两者都设置display: inline-block; vertical-align: middle,即可实现图片上下居中,具体代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
内容版权声明:除非注明,否则皆为本站原创文章。