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. centos7.0 yum 安装php服务器

    https://blog.csdn.net/jiaoshenmo/article/details/50923900 首先收一下:centos7.0用yum直接安装apache.php他们的默认版本是a ...

  2. 【laravel5.6】 laravel中间件内生成参数并且传递到控制器的2种方法

    中间件方法: /** * 自定义中间件: * * @param \Illuminate\Http\Request $request * @param \Closure $next * @return ...

  3. React性能分析利器来了,妈妈再也不用担心我的React应用慢了(转)

    Profiler React16.5正式在devtool中加入了Profiler功能,用于收集每次变更导致的渲染时间,帮助开发者发现潜在的性能问题,有助于开发更高性能的React应用 官方博客 如何使 ...

  4. 【JavaScript】--- ES6/ES7/ES8

    一.async async其实是ES7才有有的关键字,async的意思是异步,顾名思义是有关异步的操作 async用于声明一个函数是异步的. 通常情况下async.await都是跟随promise一起 ...

  5. 设计模式学习--Abstarct Factory

    What Abstarct Factory:提供一个创建一系列相关或相互依赖的接口,而无需指定他们具体类. Why Abstarct Factory是创建型设计模式的一种,主要在创建对象时解耦,避免对 ...

  6. db2 v9.7 新特性cur_commit 能够实现未提交读新特性cur_commit 能够实现未提交读

    db2 get db cfg|find "CUR_COMMIT" 当前已落实                                   (CUR_COMMIT) = ON ...

  7. 实际体验 .NET Standard 2.0 的魅力

    在我们的 .net core 大迁移工程中,有些项目完成了迁移,有些还未迁移,这就带来了一个烦恼——我们自己开发的公用类库如何在 .net core 与 .net framework 项目中共享?如果 ...

  8. python selenium配置

    写该博客时环境 mac 10.14.1 (18B75) python 3.7 pip (不用这个就是了,用pip3) $ pip --version pip 10.0.1 from /Users/wj ...

  9. nginx url问题

    测试需求,url自动加/后,发现重定向不带端口,即为 test.a.com:3443/abc  nginx自动重定向301到 test.a.com/abc,端口消失. 分析可能和nginx默认配置se ...

  10. PHP之PSR

    PHP的PSR (PSR 称为PHP Standard Recommendations) PSR参考网址:http://www.php-fig.org/psr 在PHP中,有5个编码标准分类: ①.P ...