通过vertical-align:middle实现CSS垂直居中是最常使用的方法，但是有一点需要格外注意，vertical生效的前提是元素的display：inline-block。因为inline-block可以兼具行内元素和块级元素的特点，能够使得元素有宽度和高度。从而在盒子内能够实现居中
通过display:flex实现CSS垂直居中的方法是给父元素display:flex而子元素align-self:center
这个跟CSS水平居中的原理是一样的，只是在flex-direction上有所差别，一个是row(默认值)，另外一个是column。
给父元素display:table，子元素display：table-cell的方式实现CSS垂直居中，表格也是常用的居中模式，缺点就是会对下面的元素某些样式造成一定的影响，不推荐经常使用这个方式。
先给父元素position:relative，再给子元素position:absolute，通过translateY即可定位到垂直居中的位置。这个是纵轴居中，由CSS3的新特性translate，可以改变元素在纵轴上的偏移。
设置子元素的line-height值等于父元素的height，这种方法适用于子元素为单行文本的情况。同样也是纵轴居中。
括展资料：
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS百度百科CSS参考手册
1.在div里，让文字居中：<divstyle="
width:800px
text-align:center
">kkkkk</div>
2.在span中，也是可以设置id的！在一般的标签当中都是可以设置id及class的！加油哟！
文字居中：text-align:center,有时候可能会因为其他属性的干扰使得文字不能居中，这是就需要看具体情况而定
<span>可以设置ID
一个标签可以有多个class
属性，用空格分开就行了，例如<span
id="s"
class="classone
classtwo">
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title>水平+垂直居中</title>
<style type="text/css">
div {
font-family: "microsoft yahei"
border: 5px solid #cce800
}
.container {
width: 600px
padding: 10px
margin: 10px auto
background-color: gray
}
.vertical {
display: table-cell
height: 400px
padding: 5px
text-indent: 2em
vertical-align: middle
background-color: #cce8cf
border-radius: 5px
}
</style>
</head>
<body>
<!-- 外层这个是为了实现水平居中 -->
<div class="container">
<div class="vertical">
测试垂直居中,即便是多行，我也还是垂直居中对齐的。
<h3>问题分析：</h3>
<p>1.CSS中vertical-align这个属性只是对行级元素生效，div是块级元素，所以即使设置了此属性也不会生效。</p>
<p>2.Div可以通过display属性中的table-cell值由块级元素变为行级元素（这里你可以理解为Excel里的单元格），这样就支持vertical-align的垂直居中了。</p>
<p>3.扩张一点：如果是行级元素(例如span)，也可以通过把height和line-height设置为相同值，这样也可以实现垂直居中，不过不符合你的要求，你了解即可。</p>
</div>
</div>
</body>
</html>下边是运行出来的效果：
问题分析：
1.
CSS中vertical-align这个属性只是对行级元素生效，div是块级元素，所以即使设置了此属性也不会生效。
2.
Div可以通过display属性中的table-cell值由块级元素变为行级元素（这里你可以理解为Excel里的单元格），这样就支持vertical-align的垂直居中了。
3.
扩展一点：如果是行级元素(例如span)，也可以通过把height和line-height设置为相同值，这样也可以实现垂直居中，不过不符合你的要求，你了解即可。
另外哥推荐你用sublime写前端代码，灰常不错的一款编辑器，骚年，哥能帮你的就这么多了，剩下自己努力吧。
