javascript和JQuery焦点图和代码特效大全
当前最流行的开源CMS网站系统大全
当前位置:首页 > 网站技术 > DivCss教程

css 两端对齐

来源:IT技术网编辑:雨天发布于:2017-06-20人围观

关于css 两端对齐的问题解答

css 两端对齐 三联

CSS:

复制代码
*{margin:0;padding:0;}
/*   说明:
 1.IE中要实现块内单行两端对齐需要使用其私有属性text-align-last:justify配合,text-align-last 要生效,必须先定义text-align 为justify  2.line-height:0 解决标准浏览器容器底部多余的空白 */ .demo{      text-align:justify;      text-align-last:justify;      line-height:0;      height:44px;
}
/*  说明:  模块使用[换行符]或[空格符]后,webkit浏览器中会引起最后一个模块有多余空白,使用font-size:0可清除该空格 */ @media all and (-webkit-min-device-pixel-ratio:0){ .demo{      font-size:0;
} }  /*   说明:  1.text-align-last:justify 目前只有IE支持,标准浏览器需要使用 .demo:after 伪类模拟类似效果   2.opera浏览器需要添加 vertical-align:top 才能完全解决底部多余的空白  */ .demo:after{      display:inline-block;      overflow:hidden;      width:100%;      height:0;      content:'';      vertical-align:top;
} .demo a{      width:20%;      display:inline-block;      height:44px;      line-height:44px;      text-align:center;      border:1px solid #428cc8;      color:#666;      font-size:16px;      margin-bottom:5px;      border-radius:3px;      background-color:#fefefe;      background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#fefefe),color-stop(1,#eee));      color:#666;      text-decoration:none;
}
复制代码

与相关的文章
有时间的话来看看IT界的突发事件