如何处理图标文字的混排?

 更新时间:2017年7月6日 23:13  点击:1560
  
  对于小图标和文字的混合排版的确是个很麻烦的问题,网上有人总结了以下几种解决方法,仅供大家参考:
  1、可以把小图标设为背景, 比较常见于<ul><li>制作的菜单中;(注意:可能你经常会看到在IE5下定义在LI中的小图片会在文字下面,原因就是制作者把样式定义在A中了,IE5对内联元素补白样式支持不完善,所以在一般情况下把背景小图标定义在LI中,因为LI在默认的情况下是有块元素的特性。)
  2、可以对图标进行样式定义,设定img属性margin或padding的值;
  3、可以在图片中使用align="absmiddle"来让图片绝对居中,alibaba英文网站上很多都是这样排版的。
  4、使用垂直居中的通用方法(外层设置相对位置属性,内层设置绝对位置属性,设置"top:50%;marign-top:-x/2;",x为内层的高度)。
  哪种方法是最好的?我认为应该具体情况具体分析,环境不同方法不同,大家应该灵活运用。

[!--infotagslink--]

相关文章

  • Illustrator绘制一个方形的录音机图标教程

    今天小编在这里就来给Illustrator的这一款软件的使用者们来说一下绘制一个方形的录音机图标的教程,各位想知道具体绘制方法的使用者们,那么下面就来看一下小编给大家分...2016-09-14
  • iOS设置UIButton文字显示位置和字体大小、颜色的方法

    这篇文章给大家分享了iOS如何设置UIButton的文字显示位置和字体的大小、颜色,文中给出了示例代码,相信对大家的学习和理解很有帮助,有需要的朋友们下面来一起看看吧。...2020-06-30
  • Windows批量搜索并复制/剪切文件的批处理程序实例

    这篇文章主要介绍了Windows批量搜索并复制/剪切文件的批处理程序实例,需要的朋友可以参考下...2020-06-30
  • BAT批处理判断服务是否正常运行的方法(批处理命令综合应用)

    批处理就是对某对象进行批量的处理,通常被认为是一种简化的脚本语言,它应用于DOS和Windows系统中。这篇文章主要介绍了BAT批处理判断服务是否正常运行(批处理命令综合应用),需要的朋友可以参考下...2020-06-30
  • 基于JavaScript实现文字超出部分隐藏

    这篇文章主要介绍了基于JavaScript实现文字超出部分隐藏 的相关资料,需要的朋友可以参考下...2016-03-01
  • PHP file_get_contents设置超时处理方法

    file_get_contents的超时处理话说,从PHP5开始,file_get_content已经支持context了(手册上写着:5.0.0 Added the context support. ),也就是说,从5.0开始,file_get_contents其实也可以POST数据。今天说的这篇是讲超时的,确实在...2013-10-04
  • C#多线程中的异常处理操作示例

    这篇文章主要介绍了C#多线程中的异常处理操作,涉及C#多线程及异常的捕获、处理等相关操作技巧,需要的朋友可以参考下...2020-06-25
  • postgresql 中的时间处理小技巧(推荐)

    这篇文章主要介绍了postgresql 中的时间处理小技巧(推荐),本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2021-03-29
  • C#文字换行的实现方法

    这篇文章主要介绍了C#文字换行的实现方法,通过自定义函数实现针对特定字符串的换行长度处理,是比较实用的技巧,对于C#的深入学习具有一定的借鉴价值,需要的朋友可以参考下...2020-06-25
  • Python同时处理多个异常的方法

    这篇文章主要介绍了Python同时处理多个异常的方法,文中讲解非常细致,代码帮助大家更好的理解和学习,感兴趣的朋友可以了解下...2020-07-29
  • C#异常处理中try和catch语句及finally语句的用法示例

    这篇文章主要介绍了C#异常处理中try和catch语句及finally语句的用法示例,finally语句的使用涉及到了C#的垃圾回收特性,需要的朋友可以参考下...2020-06-25
  • python用moviepy对视频进行简单的处理

    这篇文章主要介绍了python如何用moviepy对视频进行简单的处理,帮助大家更好的利用python处理视频,感兴趣的朋友可以了解下...2021-03-11
  • C#异常处理详解

    这篇文章介绍了C#异常处理,有需要的朋友可以参考一下...2020-06-25
  • 你最喜欢哪个版本?MIUI八个历史版本的系统图标汇总

    小米在3月9日下午5点推送了小米5的MIUI8.2更新,这次升级最大的改变是核心变成了Android7.0,因此加入了不少新功能。从MIUI1到MIUI8,历经了好几年了,下面小编为大家整理MIUI八个历史版本的系统图标,来看看吧...2017-07-06
  • C#利用GDI+给图片添加文字(文字自适应矩形区域)

    这篇文章主要给大家介绍了关于C#利用GDI+给图片添加文字(文字自适应矩形区域)的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起看看吧。...2020-06-25
  • sql server日志处理不当造成的隐患详解

    这篇文章主要给大家介绍了关于sql server日志处理不当造成的隐患的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用sql server具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧...2020-07-11
  • Spring MVC 处理一个请求的流程

    Spring MVC是Spring系列框架中使用频率最高的部分。不管是Spring Boot还是传统的Spring项目,只要是Web项目都会使用到Spring MVC部分。因此程序员一定要熟练掌握MVC部分。本篇博客简要分析Spring MVC处理一个请求的流程。...2021-02-06
  • go语言中的Carbon库时间处理技巧

    这篇文章主要介绍了go语言中的Carbon库时间处理,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2021-02-05
  • C++异常处理入门(try和catch)

    C++ 提供了异常机制,让我们能够捕获运行时错误,本文就详细的介绍了C++异常处理入门,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-08-09
  • C#事务处理(Execute Transaction)实例解析

    这篇文章主要介绍了C#事务处理(Execute Transaction)实例解析,对于理解和学习事务处理有一定的帮助,需要的朋友可以参考下...2020-06-25