先写上html代码，如图，内容很简单，就是一个div里有一段文本。
02再写上div对应的样式，如图，这里只设置了div的边框和高度，宽度。
03如果这里显示的话，我们看下页面，文本是不会水平居中和垂直居中的。
04要让文本水平居中，我们可以添加样式：text-align: center
要让文本垂直居中，我们可以添加样式： vertical-align: middle和display: table-cell
05添加完这几个样式后，刷新页面可以看到现在的文本已经可水平居中和垂直居中了。
1. 设置 margin: 0 auto
单行文本垂直居中，通过设置行高为父元素高度（父元素高度已知）。
图片垂直居中，设置上下padding（父元素高估不设置）。
图片垂直居中，下边这种方法会有一定偏差（父元素高估不设置）。
图片垂直居中，图片作为背景。
1. 若元素是行内块级元素, 基本思想是使用display: inline-block, vertical-align: middle和一个伪元素让内容块处于容器中央。
行内元素可可以转换为inline-block实现居中。
分类: 电脑/网络 >>程序设计 >>其他编程语言
问题描述:
<div id="b8"><a href="#"><img src=pic/28.gif>粘贴</a></div>
CSS样式和普通的一样! 但是一直图片距中,文本偏上,因为图片是16*16的,文本是12号! 如果设置边距,则图片和文本同时下移!
请问应该怎么做才能让图片和文本都垂直距中?(图片和文本都设置文本垂直距中也是没用!)
解析:
假设你的#b8的div的高度height是50px。那么再加上句line-height:50px
这是因为ie不支持垂直对齐，只能通过特殊手段hack一下。
上面的方法是将行高设置到整个div高度，适用于单行垂直居中。
还有几种其他的方法，各有各的用途。
不过都显得很麻烦。甚至有人无奈之下用js实现效果。
