text-align:设置在容器中，设置的是容器中元素的水平位置，对于容器内的块元素是不起作用的，块级元素可以使用自适应。
vertical-align:设置在具体元素中，如<img>，但是表现不是在整个容器的垂直中间，而是在行元素所在行的中间。
如果想要通过使用vertical-align使行元素在容器垂直中间，可以对容器设置line-height为容器的高度，然后再对容器中的行元素设置vertical-align:middle;
但是，这个只能够针对容器中只有一行。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test01</title>
<style>
div{
border:1px solid black;
width:400px;
height:200px;
line-height: 200px;
}
img{
width:100px;
height:100px;
vertical-align:middle;
}
</style>
</head>
<body>
<div>
<img src="香山7.jpg"/>
asdf
</div>
</body>
</html>
附：text-align word-spacing letter-spacing都是写在容器（块元素）中的属性
文本、图片居中
时间： 2024-11-09 05:47:51