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. C语言程序设计--执行命令

    1.system函数 1.1函数原型 int system(char *command); 1.2解释 system()会调用fork()产生子进程,由子进程来调用/bin/sh -c string来 ...

  2. 用SpannableString打造绚丽多彩的文本显示效果

    extends:http://www.jianshu.com/p/84067ad289d2 引语 TeXtView大家应该都不陌生,文本展示控件嘛! 就用TextView显示普普通通的文本,OK,很简 ...

  3. Flask web开发之路六

    紧接着上篇文档,写模板继承和block,URL链接和加载静态文件 模板继承和block 项目结构 主app文件代码: from flask import Flask,render_template a ...

  4. textarea 固定大小,滚动条,限制拖动,文字对齐

    取值:$("#ID").val(); 控制大小:加width,height限制(style="width:100px;height:200px;");或row, ...

  5. I - The 3n + 1 problem(2.4.2)

    I - The 3n + 1 problem(2.4.2) Crawling in process... Crawling failed Time Limit:1000MS     Memory Li ...

  6. vins-mono源码解读

    https://blog.csdn.net/q597967420/article/details/76099409

  7. AFNetworking的缓存使用

    + (NSURLCache *)defaultURLCache { // It's been discovered that a crash will occur on certain version ...

  8. XPC connection interrupted

    用Analysis 静态分析代码,发现了一些问题,修改之后,然后用Instrument -> Leaks对内存做动态分析,发现一个错误: 控制台报错:XPC connection interru ...

  9. 内存proc详解

    Linux系统上的/proc目录是一种文件系统,即proc文件系统.与其它常见的文件系统不同的是,/proc是一种伪文件系统(也即虚拟文件系统),存储的是当前内核运行状态的一系列特殊文件,用户可以通过 ...

  10. ES6:export default 和 export 区别

    export default 和 export 区别: 1.export与export default均可用于导出常量.函数.文件.模块等 2.你可以在其它文件或模块中通过import+(常量 | 函 ...