//容器设定text-align:justify
.justify{
text-align: justify;
}
//容器里面的元素
.justify i{
width:24px;
line-height:24px;
display:inline-block;
text-align:center;
border-radius:50%;
}
//伪类这个必须写
.justify:after {
content: "";
display: inline-block;
position: relative;
width: 100%;
}

两端对齐justify的更多相关文章

  1. 完美 全兼容 解决 文字两端对齐 justify 中文姓名对齐

    text-align:justify; 所有浏览器都支持,text-justify之类的却只有IE支持,就不要考虑了. justify我的理解,使元素内部的子元素两端对齐,子元素当然只能是inline ...

  2. CSS两端对齐

    前面的话   两端对齐在导航条Tab的制作中非常常用.本文将详细介绍CSS两端对齐的3种实现方式 flex   弹性盒模型flex作为强大的弹性布局方式,可以hold住大部分的布局效果,当然也包括两端 ...

  3. CSS3 justify 文本两端对齐

    浏览器参照基准:Firefox4 and Later, Chrome5 and Later, Safari5 and Later, Opera10.53 and Later, IE5.5 and La ...

  4. 两端对齐布局与text-align:justify

    百分比实现 首先最简单的是使用百分比实现,如下一个展示列表: <!DOCTYPE html> <html> <head> <meta charset=&quo ...

  5. 使用text-align:justify,让内容两端对齐,兼容IE及主流浏览器的方法

    如果不喜欢看分析过程,可以跳到最后看最终兼容方案 史前方法: 以前实现两端对齐是这样的: <p class="box1">密  码</p> <p cl ...

  6. p标签text-align:justify以及CSS文字两端对齐

    p标签样式添加text-align:justify; 那么就会左右对齐. 使用前: 使用后: CSS文字两端对齐 使用前: 代码: <style> div{ width:100px; he ...

  7. 自适应的两端对齐:text-align:justify

    <!DOCTYPE HTML> <html> <head> <title>文本两端对齐 by hongchenok</title> < ...

  8. css实现左右两端对齐均匀排列 text-align: justify

    1.实现一行文字的两端对齐均匀排列 为了实现效果只是加上一个text-align: justify;是没效果的.所以需要加上一个空标签<span><i>都可以,也可以用伪类来写 ...

  9. text-align:justify 两端对齐

    今天看页面发现一个以前没用过的css属性text-align:justify,查了一下非常实用,是一个实现文本两端对齐的属性. 使用前: 使用后: 看了一些文章还有结合inline-block+tex ...

随机推荐

  1. math ceil以及math floor,math:round

    ◎Math.ceil()执行向上舍入,即它总是将数值向上舍入为最接近的整数:◎Math.floor()执行向下舍入,即它总是将数值向下舍入为最接近的整数:◎Math.round()执行标准舍入,即它总 ...

  2. js遍历table 和 jquery 遍历table

    <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255) ...

  3. haxe 中使用音效

    将wavSound.wav音效文件放到assets/sounds下, 在project.xml加入以下代码: <assets path="assets/sounds" ren ...

  4. HDU - 4994 Revenge of Nim (取石子游戏)

    Problem Description Nim is a mathematical game of strategy in which two players take turns removing ...

  5. Codeforces Round #363 (Div. 2) B. One Bomb (水题)

    B. One Bomb time limit per test 1 second memory limit per test 256 megabytes input standard input ou ...

  6. 代码异味---Code smell

    程序员应该竭尽全力去写那些重复的代码.以下几点是我目前最需要改进的地方. 重复代码: 相同或者相似的代码存在于一个以上的地方. 长方法: 一个非常长的方法.函数或者过程. 巨类: 一个非常庞大的类. ...

  7. css脱离文档流

    作者:张秋怡链接:http://www.zhihu.com/question/24529373/answer/29135021来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出 ...

  8. Integer自动装箱拆箱bug,创建对象在-128到127

    1 public class Demo3 { public static void main(String[] args) { Integer a = 1; Integer b = 2; Intege ...

  9. a href="javascript:void(0)" 是什么意思?加不加上有什么区别?

    <A href="javascript:void(0)">点击</a>点击链接后不会回到网页顶部<A href="#">点击 ...

  10. [转]Android下打印调试堆栈方法

    http://blog.csdn.net/freshui/article/details/9456889 打印堆栈是调试的常用方法,一般在系统异常时,我们可以将异常情况下的堆栈打印出来,这样十分方便错 ...