原图：

效果图：

备注：vertical-align:middle

<div>

<p class="time tl-size12" style="padding-top: 3px">45秒前</p>

                            <img  src="../res/image/sc.png" style="width: 15px;height: 15px;padding-left: 20%;vertical-align:middle"><span class="tl-size12">收藏</span>

                            <img  src="../res/image/fx.png" style="width: 15px;height: 15px;padding-left: 20%;vertical-align:middle"><span class="tl-size12">一键分享</span>

                        </div>

html 图标和文字一行对齐的更多相关文章

  1. day3-3种实现小图标与文字水平对齐的方式

    效果图: 1.使用小图标作为背景图实现 html: <div class="test"> <ul> <li class="method1&q ...

  2. Android 自己定义 TextView drawableTop 图标与文字左对齐(效果图)

    public class DrawableTopLeftTextView extends TextView { private Paint mPaint; private float fFontHei ...

  3. css实现一行文字居中，多行文字左对齐

    问题及场景: 当内容能一行显示在盒子内时,文字居中对齐. 当内容过多换行后显示在盒子内时,文字左对齐. 其实这种视觉上的需求还是蛮常见的.比如用于弹出提示框,当提示内容比较少时,内容居中显示在弹出框, ...

  4. css:图标与文字对齐的两种方法

    (好久没写博客了,这几个月的积累比较零碎,记在本子上,现在开始整理归类) 在平时写页面的过程中,常遇到要把小图标与文字对齐的情况.比如: 总结了两种方法,代码量都比较少. 第一种 对img设置竖直方向 ...

  5. 纯CSS实现文字一行居中，多行左对齐的方法

    其实这种需求还是蛮常见的,主要用于产品列表页面,用于产品图片下面,显示产品的名称. 想要实现的效果为: 未知文字长度,当文字长度小于盒子宽度,也就是一行时,文字居中. 当文字长度大于盒子的宽度,会自动 ...

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

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

  7. CSS图标与文字对齐的两种方法

    在平时写页面的过程中,常遇到要把小图标与文字对齐的情况.比如: 总结了两种方法,代码量都比较少. 第一种 对img设置竖直方向对齐为middle, <div> <img src=&q ...

  8. css文字两端对齐

    css文字两端对齐 text-align:Justify(火狐); text-justify:inter-ideograph(IE) text-justify(IE) 基本语法 text-justif ...

  9. 【】小技巧】CSS文字两端对齐

    需求如下,红框所在的文字有四个字的.三个字的.两个字的,如果不两端对齐可以选择居中对齐,或者右对齐.但是如果要像下面这样两端对齐呢? 我相信以前很多人都这么干过:两个字中间使用 来隔开达到四个字的宽度 ...

随机推荐

  1. PHP获取POST数据的三种方式

    一.PHP获取POST数据的几种方法 方法1.最常见的方法是:$_POST['fieldname']; 说明:只能接收Content-Type: application/x-www-form-urle ...

  2. leetcode解题报告（30）：Detect Capital

    描述 Given a word, you need to judge whether the usage of capitals in it is right or not. We define th ...

  3. 飞扬的小鸟 DP

    飞扬的小鸟 DP 细节有点恶心的DP,设\(f[i][j]\)表示横坐标为\(i\)(从\(0\)开始)高度为\(j\)时,屏幕点击的最小次数为\(f[i][j]\),转移便很好写了,这里要注意枚举当 ...

  4. Processing 中玩增强现实 Argument Reality

    其实2009年Processing就能做AR了,只是我不知道而已~ 需要以下几个东西: 1.JMyron 2.GSVideo 3.nyar4psg 4.Picking 5.OBJLoader 或者大伙 ...

  5. Comet OJ - Contest #8题解

    传送门 \(A\) 咕咕咕 const int N=1005; char s[N][N];int len[N],n,id; inline bool cmp(R int j,R int k){ R in ...

  6. 如何快速把ps序列图层建立帧动画？

    工具ps 1.将序列帧图片载入ps 新建->脚本->将文件载入堆栈 2.制作序列帧动画 窗口->时间轴->时间轴面板右上角菜单->从图层建立帧 3.去除多余的透明画布 全 ...

  7. （9）打鸡儿教你Vue.js

    样式绑定 设置元素的样式 用 v-bind 来设置样式属性 class 与 style 是 HTML 元素的属性 <div v-bind:class="{ active: isActi ...

  8. T-MAX组--项目冲刺（第六天）

    T-MAX组--项目冲刺(第六天) THE SIXTH DAY 项目相关 作业相关 具体描述 所属班级 2019秋福大软件工程实践Z班 作业要求 团队作业第五次-项目冲刺 作业正文 T-MAX组--项 ...

  9. PHP异步非阻塞fsockopen(本地可以非阻塞请求,服务器就一直执行异步的不成功) (未解决)

    index.php /** * php异步请求 * * @param $host string 主机地址 * @param $path string 路径 * @param $param array ...

  10. 【转载】迄今为止把同步/异步/阻塞/非阻塞/BIO/NIO/AIO讲的这么清楚的好文章（快快珍藏）

    原文链接:https://www.cnblogs.com/lixinjie/p/10811219.html 常规的误区 假设有一个展示用户详情的需求,分两步,先调用一个HTTP接口拿到详情数据,然后使 ...