很多教程上说text-align属性只是让文本水平居中。但text-align的功能远不止如此。
对于具有文本类属性的元素，text-align属性也可以使其水平居中显示。
具有文本类属性的元素有：行内元素、行内块元素。也就是说text-align属性也可以使这些元素水平居中。
实验：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style = "width: 600px; height: 300px; background: red; text-align: center;">
<span>span标签</span>
<a href="#">a标签</a>
<img src="images/spanner1.jpg" alt="" style = "width: 50px;height: 50px">
</div>
</body>
</html>显示效果：
span, a, img 标签都是行内元素，在 div 中使用 text-align: center 水平居中
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。