css代码:

header .logo{
display:inline-block;
margin-left: 10px;
width: 15%;
line-height: 9.1rem;
background: #eee;
}
header .logo a span{
font-size: 2.1rem;
vertical-align:middle;
}
header .logo img{
width: 70px;
height: 70px;
vertical-align:middle;
}

  html代码:

    <div class="logo">
<a href="#"><img src="data:images/logo.png" alt="#"><span>新世界</span></a>
</div>

效果:

vertical-align:middle实现图片与文字垂直居中对齐的更多相关文章

  1. 【css对齐】块内或者行内图片与文字居中对齐最靠谱的方式!

    块内或者行内图片与文字居中对齐最靠谱的方式! 做图片与文字在一行的按钮时候最常用到,总结了一个靠谱的方法,终于可以完美的对齐下面给个代码 首先是html: <p class="btnU ...

  2. 用CSS如何实现单行图片与文字垂直居中

    图片样式为 以下为引用的内容:.style img{vertical-align:middle;.....} 如果STYLE中有其它如INPUT或其它内联元素可写成 以下为引用的内容:.style i ...

  3. TextView展示富文本时emoj或图片和文字不对齐的解决方案

    在项目中,回复框.聊天界面的显示往往会有emoj或者图片,但是一个比较头疼的问题是,会出现emoj表情或者图片和文字的位置不对齐,总是有偏移,这样很影响用户体验的.下面会总结一下如何解决这个问题. 本 ...

  4. iOS-Button图片和文字垂直居中【按钮图片和文字同时居中】

    以前不怎么有这样的需求,最近开发经常用到,所以就干脆封装一个这样的 Button 让图片和字体都垂直居中,重写layoutSubviews方法,来实现就可以,至于 layoutSubviews 方法什 ...

  5. p标签中的span标签文字垂直居中对齐

    <p>轻舞飞扬<span>第一次亲密接触</span></p> p标签的font-size:30px; span标签的font-size:24px; 让 ...

  6. HTML5[8]: 图文混排,图片与文字居中对齐

    <img src="image.png"><span>999</span> img { /* ...  */ vertical-align: t ...

  7. div css 图片和文字上下居中对齐

    想要图片和文字水平居中对齐很容易,可今天做这个树的时候,遇到了要将图片上下居中.这下就不知道怎么搞. 拿手册看也看不出所以然来,不同的浏览器对DIV的支持不一个,目前最好的浏览器是Firefox. 这 ...

  8. iOS开发小技巧--即时通讯项目:使用富文本在UILabel中显示图片和文字;使用富文本占位显示图片

    Label借助富文本显示图片 1.即时通讯项目中语音消息UI的实现,样式如图: 借助富文本在UILabel中显示图片和文字 // 1.创建一个可变的富文本 NSMutableAttributedStr ...

  9. css 单行/多行文字垂直居中问题

    例子可以直接看这里http://www.zhangxinxu.com/study/200911/line-height-text-v-center.html 这篇文章中有一点点解释http://blo ...

随机推荐

  1. Redis JdkSerializationRedisSerializer,stringRedisSerializer,ProtoBuf 体积,性能简单比较.

    /** * User: laizhenwei * Date: 2018-04-10 Time: 14:17 * Description: */ @RunWith(SpringRunner.class) ...

  2. python3之end关键字

    end 关键字 关键字end可以用于将结果输出到同一行,或者在输出的末尾添加不同的字符,实例如下: #!/usr/bin/python3 # Fibonacci series: 斐波纳契数列 # 两个 ...

  3. E - Radar Installation

    Assume the coasting is an infinite straight line. Land is in one side of coasting, sea in the other. ...

  4. js将图片转换为base64

    直接上代码: var img = "imgurl";//imgurl 就是你的图片路径 function getBase64Image(img) { var canvas = do ...

  5. 7:CSS Sprites的原理(图片整合技术)

    7:CSS Sprites的原理(图片整合技术) 一.将导航背景图片,按钮背景图片等有规则的合并成一张背景图,即将多张图片合为一张整图,然后用background-position”来实现背景图片的定 ...

  6. np.mgird np.ogrid

    np.ogrid: address:https://docs.scipy.org/doc/numpy/reference/generated/numpy.ogrid.html returns an o ...

  7. [No0000153]详解C# 迭代器【转】

    迭代器模式是设计模式中行为模式(behavioral pattern)的一个例子,他是一种简化对象间通讯的模式,也是一种非常容易理解和使用的模式.简单来说,迭代器模式使得你能够获取到序列中的所有元素而 ...

  8. hbase本地模式-安装及基本测试

    解压缩hbase二进制安装文件到/opt目录下: #tar -zxvf hbase-0.98.6-cdh5.3.6.tar.gz -C /opt/cdh-5.3.6/ 编辑配置文件,这里仅配置数据目录 ...

  9. Copycat - command

    client.submit(new PutCommand("foo", "Hello world!")); ServerContext connection.h ...

  10. Cmake入门资料

    1.http://blog.sina.com.cn/s/blog_3f3422fd010009vn.html 2.http://www.cnblogs.com/coderfenghc/tag/cmak ...