想要图片和文字水平居中对齐很容易,可今天做这个树的时候,遇到了要将图片上下居中.这下就不知道怎么搞.

拿手册看也看不出所以然来,不同的浏览器对DIV的支持不一个,目前最好的浏览器是Firefox.

这里涉及到两个属性,一个是line-height,另一个是vertical-align。在IE里面,只需要line-height就可以实现这个效果,不过要想在firefox和opea里面也实现这样的效果,必须用到vertical-align,而且这是属性一定要定义在image上面,而不是定义在div上。

div:

<style type="text/css">
<!--
a
{
color:#6096cf;
text-decoration:none;
font-size:12px;
}
.divcss{
width:500px;
height:12px;
vertical-align:middle;
text-align:position;
} .divcss img{
vertical-align:middle; /*optional*/
} .divcss a{
vertical-align:middle; /*optional*/
}
-->
</style>

  

顶顶顶顶<div id="AA" class="divcss"><img src="WebResourcef.gif" width="19" height="20" /> <a href="javascript:DoPostBack('1','A');" >A--马克思马克思主义、列宁主义、毛思想、邓理论</a></div>
    <div id="A"></div>

div css 图片和文字上下居中对齐的更多相关文章

  1. DIV+CSS图片不间断滚动jquery特效(Marquee插件)及移动标签marquee整理

    推荐一个jQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. marquee标签:创建一 ...

  2. [CSS]图片与文字对齐问题

    摘自:张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com] 图片与文字默认是居底对齐了.所以当图片与文字在一起的时候往往都是不对齐的.尤其图片较小时就更加明显了,我看到很多人使 ...

  3. checkbox和后面文字无法居中对齐的解决方案

    制作前端页面时,表单的页面中都存在表单元素与提示文字无法对齐的问题.下面是针对这一问题的解决方案: 先上结果图看效果,吼吼~ 最上面两个是经过css处理后的效果,已经居中对齐了哦~,最后一个是没有处理 ...

  4. iOS小知识:使UIButton中的图片和文字实现左对齐

    UIButton setImage 和 setTitle之后,默认的 image和title 对齐方式是居中, 由于 title 长度不固定,所以如果要几个这样有image有title的按钮纵向排列对 ...

  5. 问题2:css图片、文字居中

    1. 文本或图片水平对齐:父元素中添加以下样式     text-align : center;2. 单行文字垂直对齐:父元素中添加以下样式     line-height : 父元素高度; 3.图片 ...

  6. PHP合成图片、生成文字、居中对齐、画线、矩形、三角形、多边形、图片抗锯齿、不失真 高性能源码示例

    function generateImg($source, $text1, $text2, $text3, $font = './msyhbd.ttf') { $date = '' . date ( ...

  7. css中使input输入框与img(图片)在同一行居中对齐

    input,img{vertical-align:middle;},同时设置input和img的vertical-align属性,兼容ie7

  8. DIV+CSS如何让文字垂直居中?(转)

    此篇文章转自网络,但是我忘了原文地址,如果有人知道,麻烦告知一声~ 在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少 ...

  9. DIV+CSS如何让文字垂直居中?

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

随机推荐

  1. python基础之虚拟环境--常用指令

    虚拟环境的介绍和应用就不在这里赘述了,做个快捷的记录 这是官方给出来的解释了https://docs.python.org/zh-cn/3.7/tutorial/venv.html 还看到有的人,还安 ...

  2. C#演示如何使用 XML 将源码编入文档

    工作闲暇时间,将做工程过程中常用的代码段记录起来,下面的代码是关于C#演示如何使用 XML 将编入文档的代码,希望对大伙有较大帮助. using System; public class SomeCl ...

  3. SpringBoot之profile详解

    SpringBoot中使用配置文件application.properties&application.yml两种方式,在这两种方式下分别对应各自的profile配置方式,同时还存在命令行.虚 ...

  4. edu9E. Thief in a Shop

    题意:n个物品每个价值a[i],要求选k个,可以重复,问能取到哪几个价值 题解:fft裸题.但是直接一次fft,然后快速幂会boom.这样是严格的\(2^{20}*log2(2^{20})*log(w ...

  5. linux环境下安装使用selenium Chrome

    安装驱动 http://chromedriver.storage.googleapis.com/index.html 下载对应chrome浏览器版本的驱动程序 chmod +x chromedrive ...

  6. 使用Dockerfile定制ubuntu+nginx镜像

    实验目的:书写Dockerfile,定制ubuntu 14.04 + nginx 1.14.0的镜像. 实验过程: 1. 下载nginx-1.14.0  http://nginx.org/downlo ...

  7. linux 7 关闭防火墙 开启sshd服务

    启动一个服务:systemctl start firewalld.service关闭一个服务:systemctl stop firewalld.service重启一个服务:systemctl rest ...

  8. 如何将baseUrl项目地址提取放到放到static

    原本项目的baseUrl地址是放在src/common/config.js ,但是这有一个缺点,就是本地测试一个地址,生产一个地址.每发一次不同環境的包就要build一下,太麻烦了!有没有解决的办法呢 ...

  9. 在Ubuntu14.04上配置jdk环境

    服务器环境:Ubuntu14.04 server 1.进入oracle官网下载jdk1.7.0_71_x64.gz  重命名为jdk1.7 2.使用tar -xvf  jdk1.7.0_71_x64. ...

  10. 说说Android项目中的armeabi,armeabi-v7a和x86

    1.区别    这三者都表示的是CPU类型,早期的Android系统几乎只支持ARMv5的CPU架构,但是现在已经有7种了.ARMv5,ARMv7 (从2010年起),x86 (从2011年起),MI ...