CSS:文字不在图片中间
平时用的text-align属性比较多,相比较而言vertical-align则用的比较少。
当文字和图片布局在一起时,文字不能对齐到图片的中间,向这样:

HTML:
<div>
<img src="2.jpg" alt="">哈哈哈哈哈哈哈哈哈
</div>
CSS:
div{
width: 200px;
height: 50px;
}
此时需给img元素设置vertical-align:middle即可
div img{
vertical-align: middle;
}
效果图:

CSS:文字不在图片中间的更多相关文章
- css文字居中、图片居中、div居中解决方案
一.文字居中 若文字只有一行 <!--html代码--> <div class="box"> <p class="text"> ...
- <转载>使CSS文字图片div元素居中方法之水平居中的几个方法
文字居中,文字垂直居中水平居中,图片居中,图片水平居中垂直居中,块元素垂直居中?当我们在做前端开发是时候关于css居中的问题是很常见的.情 况有很多种,不同的情况又有不同的解决方式.水平居中的方式解决 ...
- 关于用css实现文本和图片垂直水平居中
关于用css实现文本和图片垂直水平居中 一直相信好记性不如烂笔头,最近遇到很多用到垂直居中的,整理一下以便日后查阅. 一.文本垂直水平居中 1.水平居中: 文字水平居中没什么好说的,用text-a ...
- css代码添加背景图片常用代码
css代码添加背景图片常用代码 1 背景颜色 { font-size: 16px; content: ""; display: block; width: 700px; heigh ...
- css 文字垂直居中问题
CSS 文字垂直居中问题 问题:在 div 中文字居中问题: 当使用 line-height:100%%; 时,文字没有居中,如下: html: <div id="header_log ...
- 大众点评评论数据抓取 反爬虫措施有css文字映射和字体库反爬虫
大众点评评论数据抓取 反爬虫措施有css文字映射和字体库反爬虫 大众点评的反爬虫手段有那些: 封ip,封账号,字体库反爬虫,css文字映射,图形滑动验证码 这个图片是滑动验证码,访问频率高的话,会出 ...
- 奇思妙想 CSS 文字动画
之前有些过两篇关于字体的文章,是关于如何定义字体的: 你该知道的字体 font-family Web 字体 font-family 再探秘 本文将会和这篇 -- CSS 奇思妙想边框动画类似,讲一些文 ...
- 用extract-text-webpack-plugin提取出来的css文件中背景图片url的不正确的问题
在一个main.js中require一个scss文件,scss文件中用了背景图片,图片url是用的相对路径,用extract-text-webpack-plugin插件提取出的css文件背景图片路径不 ...
- CSS Image Sprite--网页图片应用处理方式
CSS Sprites简介 CSSSprites在国内很多人叫css精 灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片 ...
随机推荐
- Bash 4.4 中新增的 ${parameter@operator} 语法
Bash 4.4 中新增了一种 ${...} 语法,长这样:${parameter@operator}.根据不同的 operator,它展开后的值可能是 parameter 这个参数的值经过某种转换后 ...
- Pandas-数据聚合与分组运算
目录 图解"split-apply-combine" 数据的分类split: groupby() 以column进行分组 以index进行分组 分组遍历 数据的应用apply: a ...
- MySQL检查重复索引工具-pt-duplicate-key-checker
在MySQL中是允许在同一个列上创建多个索引的,示例如下: mysql --socket=/tmp/mysql5173.sock -uroot -p mysql> SELECT VERSION( ...
- 《征服 C 指针》摘录4:函数 与 指针
一.指向函数的指针 函数名可以在表达式中被解读成“指向函数的指针”,因此,正如代码清单 2-2 的实验那样,写成 func 就可以取得指向函数的指针. “指向函数的指针”本质上也是指针(地址),所以可 ...
- Asp.Net Core--基于声明的授权
翻译如下: 当创建身份时,其可以被分配由可信方发布的一个或多个声明. 索赔是名称值对,表示主题是什么,而不是主体可以做什么. 例如,您可能有驾驶执照,由当地驾驶执照颁发. 您的驾驶执照上有您的出生日期 ...
- 号外!GNOME 3.22 正式发布喽!!!
导读 经过半年的努力开发,别名为“卡尔斯鲁厄”的 GNOME 3.22 正式发布了!“GNOME Software 可以安装和更新 Flatpak 软件包,GNOME Builder 则可以创建它们, ...
- 两个int的和判断溢出
long a,b; cin>>a>>b; long i; i = a+b; if((i^a)<0 && (i^b)<0) cout<<& ...
- js倒计时,显示NaN天NaN时NaN分(或显示天时分)
最近在开发跨平台的应用,在做秒杀功能时,倒计时出现了问题.默认在Chrome浏览器中运行,倒计时没出现问题.而在IE浏览器,火狐浏览器,safari浏览器上运行时,则显示NaN天NaN时NaN分(或显 ...
- AngularJS ui-router (嵌套路由)
http://www.oschina.net/translate/angularjs-ui-router-nested-routes AngularJS ui-router (嵌套路由) 英文原文:A ...
- 【Docker】Docker主机为什么ip nets 查不到网络空间
创建Docker容器后本来应该有新的命名空间(如果有独立网络的话),那么可以通过 ip netns 命令查看到命名空间,但是实际上却看不到. 查过资料才发现,ip netns 只能查看到 /var/r ...