用em包图片记
像这种很常见的字体旁边带图标的,很多都是用em的background去实现。
<li><em class="wx"></em><a href="">微信登陆</a></li>
.nav-top .wx{background: url(images/wx.png) no-repeat;padding: 1px 11px;}
刚开始没设padding,图标死活不出来。据yuge的说法,em是空的,padding为它里面设置了间距,所以有空间显示图片。
而且如果把em放到a里面,就算设了padding图标还是不显示,要把a设为a{display: inline-block;},图标才能显示。block会独占一行,能设宽高,inline是多个元素在一行,设宽高无效,inline-block就是能多个div在一行,而且inline-block水平呈现的元素间,换行符或空格分隔的情况下都会使两个块间有间距。
,
用em包图片记的更多相关文章
- [js高手之路]深入浅出webpack教程系列9-打包图片(file-loader)用法
我们还是接着上文继续,本文我们要讲的是图片资源的打包,图片在静态排版中,经常出现的两个位置是css通过background引入背景,还有一种就是在html模板文件中用img标签引入的方式,如果要在we ...
- 【maven 】jar包冲突-记一次冲突解决
方法一:根据mvn提示一个一个排除 1.请到pom.xml文件所在的目录(包含父子目录)下分别执行下面的命令排查是什么原因导致fastjson版本不正确: mvn dependency:tree -D ...
- Bootstrap 3的box-sizing样式导致UEditor控件的图片无法正常缩放
UEditor组件是百度提供的一套开源的web在线所见即所得富文本编辑器,具有轻量,可定制,注重用户体验等特点,基于MIT协议,功能很强大.最近在使用的过程中发现其中上传的图片(或者插入已有的表情包图 ...
- java 上传图片 并压缩图片大小
Thumbnailator 是一个优秀的图片处理的Google开源Java类库.处理效果远比Java API的好.从API提供现有的图像文件和图像对象的类中简化了处理过程,两三行代码就能够从现有图片生 ...
- 四:Java使用google的thumbnailator工具对图片压缩水印等做处理
Thumbnailator是一个非常好的图片开源工具 使用方法: 在pom中加入以下jar包 <!-- 图片缩略图 图片压缩 水印 start--> <dependency>& ...
- java 上传图片 并压缩图片大小(转)
Thumbnailator 是一个优秀的图片处理的Google开源Java类库.处理效果远比Java API的好.从API提供现有的图像文件和图像对象的类中简化了处理过程,两三行代码就能够从现有图片生 ...
- 一次httpserver优化的经验和教训(silverlight游戏 - 金庸群侠传X0.5上线记)
金X因为被推荐到ACFUN游戏排行第一名.并同一时候在17YY.7K7K.U77.17173等各大小游戏站点上线.迎来了在线用户数量的爆炸式增长.眼下各大站点使用外链方式.也就是实际链接到金X官网的s ...
- WordPress 使用本地化的 emoji 表情包
WordPress 结合使用 Native Emoji 和 WP Local Emoji 两个插件,可以达到使用本地化的 emoji 表情包的目的. 安装好上述两个插件并且启用: 为了使 Native ...
- java上传图片并压缩图片大小
Thumbnailator 是一个优秀的图片处理的Google开源Java类库.处理效果远比Java API的好.从API提供现有的图像文件和图像对象的类中简化了处理过程,两三行代码就能够从现有图片生 ...
随机推荐
- IntelliJ IDEA的配置优化
IntelliJ IDEA的配置优化 我们安装完IntelliJ IDEA之后,在弹出的欢迎页面下方点击Configure,选择Setting,打开以下界面,我们在这个界面中进行配置. Appeara ...
- 拯救安卓手机的数据(无法进入系统只能打开recovery)
这里不得不赞一个谷歌的开放,如果不是这样读取数据就很糟糕了,记得一千带着我的mac本子到苹果店,那个所谓的“天才”就说苹果的数据无法读取,我了个艹,为了避免丢失你必须得准备一个TM.好了废话不多说,进 ...
- C++/C 宏定义(define)中# ## 的含义(转)
http://hi.baidu.com/kiraversace/item/1148ee057147981a4ac4a3e9 C++/C 宏定义(define)中# ## 的含义 define 中的# ...
- Asp.Net AutoMapper用法
1.AutoMapper简介 用于两个对象映射,例如把Model的属性值赋值给View Model.传统写法会一个一个属性的映射很麻烦,使用AutoMapper两句代码搞定. 2.AutoMapper ...
- Python(十)之GUI编程
在windwos上实现:使用wxPython模块 #!/usr/bin/env python # encoding: utf-8 import wx #创建open按钮触发的事件对应的函数 def l ...
- Android Launcher分析和修改1——Launcher默认界面配置(default_workspace)
最近工作都在修改Launcher,所以打算把分析源码和修改源码的过程记录下来,最近会写一些关于Launcher的分析和修改博文.因为我是修改4.0.3的Launcher,所以后面文章里面的Launch ...
- Oracle数据库学习(一)安装和简单使用
新公司的新项目,需要用到Oracle数据库,所以现在便来解除此数据库,不得不说,这个数据库还这是麻烦. 安装倒是简单,就是中间会遇到各种问题. 安装步骤参考:https://blog.csdn.net ...
- Java编程的逻辑 (81) - 并发同步协作工具
本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http: ...
- Private表示该属性(方法)为只有本类内部可以访问(类内部可见)。
Public表示该属性(方法)公开: (想用private还要用set和get方法供其他方法调用,这样可以保证对属性的访问方式统一,并且便于维护访问权限以及属性数据合法性) 如果没有特殊情况,属性一定 ...
- tmux常用配置
首先创建配置文件 $ touch ~/.tmux.conf 一,鼠标支持 对于version 2.1 (18 October 2015)之后的版本,编辑配置文件.tmux.conf, 保存即可. se ...