图片文字绝对居中,并排显示

我们在做网页的时候, 会遇到一个图片和文字位置对不齐的问题.
虽然解决的办法有很多.比如. 
用table来控制图片和文字居中对齐 (这样会因为一个小图片写多很多代码) 
使用图片的Align属性 设置为align="absmiddle" (但是要知道,标准的W3C中定义的img标签是不支持Align属性的)

以上的方法都不是解决问题最好的办法.后来无意中发现可以用CSS来解决这个问题.

一个关键的属性: margin-bottom 通过修改图片的外边框的底部高度就可以让文字移动上来. 做法是把这个值设置为负数.例如我们把下面的16X15的图片设置它的style="margin-bottom:-3px" 这样文字和图片就居中了. 这个值随着图片的大小不同而改变,具体的大家测试一下就知道了. 

时间: 2024-09-11 03:35:48

图片文字绝对居中,并排显示的相关文章

让2个DIV居中并排显示_经验交流

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

Android DrawableTextView图片文字居中显示实例

在我们开发中,TextView设置Android:drawableLeft一定使用的非常多,但Drawable和Text同时居中显示可能不好控制,有没有好的办法解决呢? 小编的方案是通过自定义TextView实现. 实现的效果图: 注:第一行为原生TextView添加android:drawableLeft 第二行为自定义TextView实现的效果. 实现思路: 继承TextView,覆盖onDraw(Canvas canvas),在onDraw中先将canvas进行translate平移,再调

css中文字图片背景图居中的方法汇总

一.让网页所有DIV标签内文字居中   -   实现所有DIV内字体居中实例完整网页源代码: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>div字体居中实例</title> <style> div{text-align:center

css垂直居中怎么设置?文字上下居中和图片垂直居中

css 居中分css垂直居中和css水平居中,水平居中平时比较常用,这里我们主要讲css上下居中的问题.垂直居中又分为css文字上下居中和css图片垂直居中,下面我们就分别来介绍一下. css文字上下居中:一.单行内容的居中.只考虑单行是最简单的,无论是否给容器固定高度,只要给容器设置 line-height 和 height,并使两值相等,再加上 over-flow: hidden 就可以了.css代码为{height: 4em;line-height: 4em;overflow: hidde

Cocos2D-X入门(3)图片文字显示

在cocos2D-X中,一般用CCLabelTTF来显示文字: CCLabelTTF* pLabel=CCLabelTTF::create("This is a Label","Arial",24); pLabel->setPosition(ccp(mSize.width/2,mSize.height/2)); this->addChild(pLabel); 如果想要用自己设计的文字,那就要用CCLabelAtlas了,具体用法: //参数依次:文字内容

Word 2007转换WEB页面时,用文字代替不能正常显示的图片

Word 2007转换WEB页面时,用文字代替不能正常显示的图片   当将Word2007内容转换成WEB网页内容的时候,如果部分网页图片不能正常显示,这会让生成的网页非常的难看,非常的不协调.我们这时可以通过在图片位置显示代替文字来替换无法显示的图片.具体的操作方法如下: (1)在目标图片上单击右键,执行"设置图片格式"命令,打开"设置图片格式"对话框. (2)单击"可选文字"选项卡,在"可选文字"区域下 文本框中,输入要显

自定义的cell中,button不显示图片文字 求大神告诉我下

问题描述 自定义的cell中,button不显示图片文字 求大神告诉我下 这是自定义的cell - (UIButton *)categoryBtn{ if (!_categoryBtn) { _categoryBtn = [[UIButton alloc]init]; _categoryBtn.backgroundColor = [UIColor yellowColor]; _categoryBtn.titleLabel.text = @""111111""; [_

app-APP安卓版的图片+文字链接,分享到微博最新版本后,只显示图片?

问题描述 APP安卓版的图片+文字链接,分享到微博最新版本后,只显示图片? APP安卓版的图片+文字链接,分享到微博最新版本后,只显示图片?但是APPiOS版的图片+文字链接,分享到新浪微博最新版本后,没有问题.什么原因呢?哪位大侠指点下. APP-蜂传 解决方案 微信有显示的不允许有外链 解决方案二: 在更新到微博最新版本之前分享图文链接是不是正常的呢?你可以贴出分享部分代码. 解决方案三: 谢谢@我爱生活 谢谢@苏小喵 我先看看

安卓(Android)ListView 显示图片文字_Android

一.代码实现 1.  "Activity_11\src\yan\activity_11\MainActivity.java" package yan.activity_11; import android.os.Bundle; import android.app.Activity; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import a