页面排版经常遇到‘图标+文字’的需求,正常样式写下来是这样

​,

但产品要的应该是长这样

​,怎么办呢?其实很简单,加个样式看看

vertical-align: top/middle/bottom;
浏览器都支持,当然后面的值是上对齐,下对齐,还是居中就要你自己去发挥喽~

CSS图标文字不对齐的更多相关文章

  1. 使用CSS达到文字首尾对齐效果

    在制作表单的时候经常会遇到需要不同个数的文字首尾对齐,比如: <span>姓名:</span> <span>联系方式:</span> 姓名: 联系方式: ...

  2. CSS技巧-文字分散对齐的方法

    下面的代码可以在IE中实现文字分散对齐: <table width="300" align="center">    <tr>      ...

  3. CSS实现文字两端对齐

    最近的项目遇到了这样的需求:(要求标题部分不管文字多少,都必须两端对齐) 如下图: 当时也没有多想直接使用‘ ’进行代替,毕竟产品同学想快一点看到效果,不敢怠慢!不过到第二个页面就傻眼了. 如图: 这 ...

  4. css text-align文字两端对齐

    text-align:start | end | left | right | center | justify | match-parent | justify-all justify: 内容两端对 ...

  5. 使用css让文字两端对齐

    text-align:justify; text-justify:distribute-all-lines; text-align-last:justify;可以让文字实现两端对齐

  6. CSS 控制文字两端对齐

    <html> <head> <style> td:after { content: ''; } td p{ font-size: 14px; width: 5em; ...

  7. CSS笔记---文字两边对齐

    <style> .box{ width: 1000px; height: 500px; background-color: #aa0000; margin:0 auto; } .teste ...

  8. css中文字两端对齐兼容IE

    text-align: justify; text-justify:inter-ideograph;

  9. css图标与文字对齐实现方法

    1.移动端(安卓设备.ios设备)图标文字垂直居中对齐的最佳常用解决方案是采用弹性盒子布局,可以快捷有效实现子元素未知高度绝对垂直居中对齐.PC端考虑到兼容性的问题,一般不推荐使用弹性盒子,依旧只能采 ...

随机推荐

  1. <c:if test=""></c:if>如何判断空(使用例子)

    <c:if test=""></c:if>如何判断空(使用例子) 标签: session / 前端 / c-if userName是登录的时候放到sessi ...

  2. D3.js的基础部分之选择集的处理 enter和exit的处理方法 (v3版本)

    上一节给大家讲述额绑定数据的原理.当数组的长度与元素的数量不一致时,有enter部分和exit部分,前者表示存在多余的数据,后者表示存在多余的元素.本节将给大家介绍如何处理这些多余的东西,最后会给大家 ...

  3. centos7 升级GCC版本到7.3.0

    废话不多说,直接上shell,还是比较简单的.就是编译时间有点长... 都是以小时计的......,我刀片机上面一台虚拟机反正是等了3个小时 #必备组件安装 yum install -y gcc gc ...

  4. centos docker 安装笔记

    安装epel rpm -ivh http://dl.fedoraproject.org/pub/epel/6/i386/epel-release-6-8.noarch.rpm rpm --import ...

  5. 传染病传播模型(SIS)Matlab代码

    function spreadingability=sir(A,beta,mu) for i=1:length(A) for N=1:50%随机次数 InitialState=zeros(length ...

  6. 05-02 Java 一维数组、内存分配、数组操作

    数组的定义 动态初始化 /* 数组:存储同一种数据类型的多个元素的容器. 定义格式: A:数据类型[] 数组名; B:数据类型 数组名[]; 举例: A:int[] a; 定义一个int类型的数组a变 ...

  7. 题外话 -- windows10系统C盘空间变大 CPU莫名跑满

    场景描述: 安装windows10一段时间了,发现C盘空间越来越小 CPU有时候,莫名其妙的跑满,造成操作卡顿. 如何处理参考: windows10 C盘空间清理:https://jingyan.ba ...

  8. Centos 7 安装 Redis 3.2

    环境: Centos 7 GCC            #未安装,使用yum install gcc安装 1.下载redis 官方下载网站:https://redis.io/download.请在页面 ...

  9. 了解fortran语言

    最近看了一些文献,发现用了Fortran语言编程,并且还是近几年的,了解了之后才知道,其实Fortran已经慢慢没有人再用了,之所有还有一批人在用,极大可能是历史遗留问题吧.而这,也得从Fortran ...

  10. android studio 查看包有没有重复引用

    在windows下studio内的命令行里面     gradlew :app:dependencies 苹果系统  ./gradlew :app:dependencies