div css 图片和文字上下居中对齐
想要图片和文字水平居中对齐很容易,可今天做这个树的时候,遇到了要将图片上下居中.这下就不知道怎么搞.
拿手册看也看不出所以然来,不同的浏览器对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 图片和文字上下居中对齐的更多相关文章
- DIV+CSS图片不间断滚动jquery特效(Marquee插件)及移动标签marquee整理
推荐一个jQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. marquee标签:创建一 ...
- [CSS]图片与文字对齐问题
摘自:张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com] 图片与文字默认是居底对齐了.所以当图片与文字在一起的时候往往都是不对齐的.尤其图片较小时就更加明显了,我看到很多人使 ...
- checkbox和后面文字无法居中对齐的解决方案
制作前端页面时,表单的页面中都存在表单元素与提示文字无法对齐的问题.下面是针对这一问题的解决方案: 先上结果图看效果,吼吼~ 最上面两个是经过css处理后的效果,已经居中对齐了哦~,最后一个是没有处理 ...
- iOS小知识:使UIButton中的图片和文字实现左对齐
UIButton setImage 和 setTitle之后,默认的 image和title 对齐方式是居中, 由于 title 长度不固定,所以如果要几个这样有image有title的按钮纵向排列对 ...
- 问题2:css图片、文字居中
1. 文本或图片水平对齐:父元素中添加以下样式 text-align : center;2. 单行文字垂直对齐:父元素中添加以下样式 line-height : 父元素高度; 3.图片 ...
- PHP合成图片、生成文字、居中对齐、画线、矩形、三角形、多边形、图片抗锯齿、不失真 高性能源码示例
function generateImg($source, $text1, $text2, $text3, $font = './msyhbd.ttf') { $date = '' . date ( ...
- css中使input输入框与img(图片)在同一行居中对齐
input,img{vertical-align:middle;},同时设置input和img的vertical-align属性,兼容ie7
- DIV+CSS如何让文字垂直居中?(转)
此篇文章转自网络,但是我忘了原文地址,如果有人知道,麻烦告知一声~ 在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少 ...
- DIV+CSS如何让文字垂直居中?
在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...
随机推荐
- h5微信支付在微信内页使用微信公众号支付
由于app的迭代,原本的微信支付是使用原生写的 然后h5这边做交互,现在需要修改使用h5的微信支付,于是就有了现在的这个例子,微信支付其实对于我们前端来说就是调用接口然后,根据链接进行支付,其中有点坑 ...
- 序列化---Serializable与Externalizable源码
Serializable接口总结: 1. java.io.Serializable接口是一个标识接口,它没有任何字段和方法,用来表示此类可序列化: 2. 父类声明该接口,则其与其所有子类均可序列化,都 ...
- 下载网站js css img 资源
- 229. Majority Element II求众数II
网址:https://leetcode.com/problems/majority-element-ii/ 参考:https://blog.csdn.net/u014248127/article/de ...
- OO的奇妙冒险1
OO的奇妙冒险 ~OOP入门与字符串处理~ 目录 总体分析 作业内容分析 作业内容总结 互测的收获 公测互测bug分析与总结 不太正经的个人自嗨 总体分析 公测 中测(基础与进阶): 其实在我看来,从 ...
- keras神经网络做简单的回归问题
咸鱼了半个多月了,要干点正经事了. 最近在帮老师用神经网络做多变量非线性的回归问题,没有什么心得,但是也要写个博文当个日记. 该回归问题是四个输入,一个输出.自己并不清楚这几个变量有什么关系,因为是跟 ...
- 从零开始学Python 一
一.安装 1.进入Python官网下载环境:https://www.python.org 2.根据自己的电脑选择安装版本,然后安装即可. 二.运行第一个程序 1.安装完Python,会自带一个编辑器, ...
- hdu第4场j.Let Sudoku Rotate
Problem J. Let Sudoku Rotate Time Limit: / MS (Java/Others) Memory Limit: / K (Java/Others) Total Su ...
- 此博客不再更新和分享UiPath文章
由于版权问题,将不再分享我的笔记 警告:任何人不得拷贝及挪用我的uipath笔记作为商业用途,一旦发现,立刻发律师函,请知悉及慎重!!!!
- Oracle单机Rman笔记[2]---RMAN基础介绍
A.DBA对于备份恢复的问题: 1.在数据库发生故障时,丢失多少数据是可承受的? 2.恢复数据库时,能够忍受的最长时间多少? 3.为了确保您的数据能够被恢复,愿意投入多少成本? 4.备份期间可以关闭系 ...