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

​，

但产品要的应该是长这样

​，怎么办呢？其实很简单，加个样式看看

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. 利用koa打造restful API

    概述 最近学习利用koa搭建API接口,小有所得,现在记录下来,供以后开发时参考,相信对其他人也有用. 就目前我所知道的而言,API有2种,一种是jsonp这种API,前端通过ajax来进行跨域请求获 ...

  2. pm2 官方文档 学习笔记

    一.安装 1.安装 npm install pm2 -g 2.更新 npm install pm2 -g && pm2 update pm2 update 是为了刷新 PM2 的守护进 ...

  3. Android MediaPlayer setDataSource failed

    今天在尝试使用MediaPlayer播放音乐时出了一个问题,在使用 mp.setDataSource(this,Uri.parse("/sdcard/Music/adele.mp3" ...

  4. flask_mail发送邮件(附源码)

    文章介绍如何用flask_mail发送QQ邮件,发送其它邮箱简单的更改相应配置即可 传送门:源代码 源代码地址:https://github.com/1417766861/flask_mail 首先展 ...

  5. NVIDIA GRID 和 NICE DCV 技术用于实现 Linux 和 Windows® 图形加速虚拟桌面

    NVIDIA GRID 和 NICE DCV 技术用于实现 Linux 和 Windows® 图形加速虚拟桌面. NICE DCV: 满足 LINUX 和 WINDOWS 的远程 3D 通过 NICE ...

  6. [LeetCode] 206. Reverse Linked List_Easy tag: Linked List

    Reverse a singly linked list. Example: Input: 1->2->3->4->5->NULL Output: 5->4-> ...

  7. odoo开发笔记 -- odoo10 视图界面根据字段状态，动态隐藏创建&编辑按钮

    场景描述: 解决方式: 网络搜索,vnsoft_form_hide_edit 找到了这个odoo8的模块, odoo10语法和视图界面有新的变化,所以需要修改一些地方,感兴趣的小伙伴可以对比下两个代码 ...

  8. (转) CentOS7.4 + MySQL8.0 + Git + Gogs搭建

    原文:https://blog.csdn.net/qq_16075483/article/details/80295793 1.装系统,这个不会的下面就不用看了2.CentOS7.X安装MySQL8. ...

  9. Git使用（3）

    1.查看本地和远程分支 git branch -a 删除本地分支 git branch -D branchName(D要大写) 删除远程分支 git push origin :branchName 2 ...

  10. keytool和openssl生成的证书转换

    keytool和openssl生成的证书转换 keytool生成证书示例 生成私钥+证书: keytool -genkey -alias client -keysize 2048 -validity ...