当前位置:学学看123知识中心电脑教学网页设计图片与文字在一行上垂直居中的方法» 正文

图片与文字在一行上垂直居中的方法

[06-11 19:38:06]   来源:http://www.xxk123.com  网页设计   阅读:8170

导读: 不知大家在做网站的时候有没有遇到这样的情况:在一行上会插入一个小图标,然后在图标后面配上文字说明,可是发现往往图片和文字并不垂直居中,在一行上图片老是相对文字要偏上一些,显的很不好看,那么有没有办法使图片与文字在一行上垂直居中呢?试了很多方法都不太理想,最终找到了一种简单有效的方法,拿来分享。 其实只需要设置图片的align属性为absmiddle即可,相关代码请看下面:<img src=http://www.xxk123.com/article/"htmer.jpg" align="absmiddle" />欢迎光临HTMer.Com 经过上面的设置后图片和文字就能在一行上保持垂直居中了,当然还有其他方法可以实现同样的效果,大家可以留言分享。 小知识:其实img标签的align属性还有其他成员,下面列举出来供大家参考备用: 成员名称 说明 AbsBottom 图像的下边缘与同一行中最大元素的下边缘对齐。 AbsMiddle 图像的中间与同一行中最

图片与文字在一行上垂直居中的方法,标签:网页设计教程,网页设计知识,http://www.xxk123.com

    不知大家在做网站的时候有没有遇到这样的情况:在一行上会插入一个小图标,然后在图标后面配上文字说明,可是发现往往图片和文字并不垂直居中,在一行上图片老是相对文字要偏上一些,显的很不好看,那么有没有办法使图片与文字在一行上垂直居中呢?试了很多方法都不太理想,最终找到了一种简单有效的方法,拿来分享。

    其实只需要设置图片的align属性为absmiddle即可,相关代码请看下面:

<img src=http://www.xxk123.com/article/"htmer.jpg" align="absmiddle" />欢迎光临HTMer.Com

    经过上面的设置后图片和文字就能在一行上保持垂直居中了,当然还有其他方法可以实现同样的效果,大家可以留言分享。

    小知识:其实img标签的align属性还有其他成员,下面列举出来供大家参考备用:

    成员名称       说明
    AbsBottom  图像的下边缘与同一行中最大元素的下边缘对齐。 
    AbsMiddle   图像的中间与同一行中最大元素的中间对齐。 
    Baseline     图像的下边缘与第一行文本的下边缘对齐。 
    Bottom        图像的下边缘与第一行文本的下边缘对齐。 
    Left              图像沿网页的左边缘对齐,文字在图像右边换行。 
    Middle         图像的中间与第一行文本的下边缘对齐。 
    NotSet         未设定对齐方式。 
    Right            图像沿网页的右边缘对齐,文字在图像左边换行。 
    TextTop       图像的上边缘与同一行上最高文本的上边缘对齐。 
    Top              图像的上边缘与同一行上最高元素的上边缘对齐。


Tag:网页设计网页设计教程,网页设计知识电脑教学 - 网页设计
《图片与文字在一行上垂直居中的方法》相关文章

Copyright 学学看123 All Right Reserved.

1 2 3 4 5 6 7 8 9 10