css设置文字与图像垂直居中

xdwangiflytek

于 2012-01-04 13:27:09 发布

阅读量141

点赞数

分类专栏： Html/Div+CSS 文章标签： css html 图像与文字垂直居中

Html/Div+CSS 专栏收录该内容

12 篇文章

订阅专栏

在项目开发中，经常需要使用图片，但是有的时候需要将图片与文字在同一行时，往往会出现错位，下面展示通过css如果将图片与文字垂直居中：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>文字与图像垂直居中</title>
    <meta http-equiv="content-type" content="text/html;charset=gb2312">
    <style type="text/css">
        #title *
        {
            vertical-align: middle;
        }
    </style>
</head>
<body>
    <div id="title">
        <img src="http://www.baidu.com/img/baidu_sylogo1.gif">
        <a href="#">测试文字与图像垂直居中</a>
    </div>
</body>
</html>