css 文字与小图标对齐
.icon {
display: inline-block;
width:20px; height:20px;
background: url(delete.png) no-repeat center;
white-space:nowrap;
letter-spacing: -1em;
text-indent: -99em;
color: transparent;
/* IE7 */
*text-indent: 0;
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\3000');
}
.icon:before {
content: '\3000';
}
HTML代码:
<strong>情形1,空标签</strong>
<p><i class="icon"></i> 删除</p>
<strong>情形2,内部有文字</strong>
<p><a href="javascript:" class="icon">删除</a> 后面的文字</p> <p style="color:gray;">--------下面是反例------</p> <strong>设置了overflow:hidden</strong>
<p><i class="icon" style="overflow:hidden;"></i> 删除</p>
css 文字与小图标对齐的更多相关文章
- CSS sprites(css 精灵):将小图标整合到一张图片上
一.什么是css sprites css sprites直译过来就是CSS精灵.通常被解释为“CSS图像拼合”或“CSS贴图定位”.其实就是通过将多个图片融合到一张图里面,然后通过CSS backgr ...
- day3-3种实现小图标与文字水平对齐的方式
效果图: 1.使用小图标作为背景图实现 html: <div class="test"> <ul> <li class="method1&q ...
- CSS之fontAwesome代替网页icon小图标
引言 奥森图标(Font Awesome)提供丰富的矢量字体图标—通过CSS可以任意控制所有图标的大小 ,颜色,阴影. 网页小图标到处可见,如果一个网页都是干巴巴的文字和图片,而没有小图标,会显得非常 ...
- CSS Icon 项目地址 小图标-用css写成的
http://cssicon.space/#/icon/focus 这是所有用css写成的 小图标 右侧有 html和css代码
- css文字两端对齐
css文字两端对齐 text-align:Justify(火狐); text-justify:inter-ideograph(IE) text-justify(IE) 基本语法 text-justif ...
- android Editview中加小图标或者文字实现
关于这个问题,如果只是加小图标的话,已经提供了很好的支持,drawableLeft属性就可以设置左边的小图标,类推,右边也可以 不过如果你要加的是文字,我找了下,没有相应的属性,我们只能通过转换思路去 ...
- win10 系统右键菜单不显示文字(只有小图标)修复方法
如下图,win10点击鼠标右键调出菜单时,看不到菜单的文字,只显示了小图标. 解决方法: Cortana 搜索 cmd ,看到 命令提示符,右键,选择 以管理员身份运行. 在命令提示符里输入以下命令, ...
- iconfont字体图标和各种CSS小图标
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! iconfont字体图标 我们的需求中,很多时候会看到一些小的图形,或者叫图标,比如天猫网站中: ...
- p标签text-align:justify以及CSS文字两端对齐
p标签样式添加text-align:justify; 那么就会左右对齐. 使用前: 使用后: CSS文字两端对齐 使用前: 代码: <style> div{ width:100px; he ...
随机推荐
- Proxy(代理)-对象结构型模式
1.意图 为其它对象提供一种代理以控制对这个对象的访问. 2.别名 Surrogate. 3.动机 通过Proxy可以达到对一个对象的访问控制. 4.适用性 远程代理 为一个对象在不同地址空间提供局 ...
- SQL 查询性能优化----解决书签查找
先来看看什么是书签查找: 当优化器所选择的非聚簇索引只包含查询请求的一部分字段时,就需要一个查找(lookup)来检索其他字段来满足请求.对一个有聚簇索引的表来说是一个键查找(key lookup), ...
- EXCEL拼接SQL
=CONCATENATE("insert into 表名 (字段名1,字段名2)values (3, '"&C3&"');") 用CONCAT ...
- kafka java实例
生产者 package com; import java.util.Properties; import java.util.concurrent.TimeUnit; import kafka.jav ...
- PHP从mysql获取数据的方法
<?php require "database.php"; //读取数据库中的数据 $sql_1 = "SELECT * FROM test_table" ...
- (原创)通用查询实现方案(可用于DDD)[附源码] -- 简介
[声明] 写作不易,转载请注明出处(http://www.cnblogs.com/wiseant/p/3985353.html). [系列文章] 通用查询实现方案(可用于DDD)[附源码] -- ...
- Only the sqlmigrate and sqlflush commands can be used when an app has migrations.
samcao@samcao-Lenovo-IdeaPad-Y470:~/caodjango/caossh$ python manage.py sqlall getssh System check id ...
- 强连通分量的一二三 | | JZOJ【P1232】 | | 我也不知道我写的什么
贴题: 在幻想乡,上白泽慧音是以知识渊博闻名的老师.春雪异变导致人间之里的很多道路都被大雪堵塞,使有的学生不能顺利地到达慧音所在的村庄.因此慧音决定换一个能够聚集最多人数的村庄作为新的教学地点.人间之 ...
- call_user_function()方法的使用
call_user_func ( callback $function [, mixed $parameter [, mixed $... ]] ) 调用第一个参数所提供的用户自定义的函数. 返回值: ...
- verilog循环结构
1. always(posedge CLOCK) . case(i) . . : . ) ’d0; i <= i + ’b1; end . ’b1; C1 <= C1 + ’b1; end ...