CSS 文字两端对齐
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
.box1{
background:red;
width:%;
}
.scatter {
text-align:justify;
text-justify:distribute-all-lines;/*ie6-8*/
text-align-last:justify;/* ie9*/
-moz-text-align-last:justify;/*ff*/
-webkit-text-align-last:justify;/*chrome 20+*/
}
@media screen and (-webkit-min-device-pixel-ratio:){/* chrome*/
.scatter:after{
content:".";
display: inline-block;
width:%;
overflow:hidden;
height:;
}
}
</style>
</head>
<body>
<div class="box1">
<div class="scatter">姓 名</div>
<div class="scatter">姓 名 姓 名</div>
<div class="scatter">姓 名 名</div>
<div class="scatter">所 在 地</div>
<div class="scatter">工 作 单 位</div>
</div>
</body>
</html>
http://blog.sina.com.cn/s/blog_7db0c22a01011emo.html
http://www.cnblogs.com/Travel/p/4552701.html
CSS 文字两端对齐的更多相关文章
- css文字两端对齐
css文字两端对齐 text-align:Justify(火狐); text-justify:inter-ideograph(IE) text-justify(IE) 基本语法 text-justif ...
- p标签text-align:justify以及CSS文字两端对齐
p标签样式添加text-align:justify; 那么就会左右对齐. 使用前: 使用后: CSS文字两端对齐 使用前: 代码: <style> div{ width:100px; he ...
- 可用的CSS文字两端对齐
最近在工作项目中接触到Web界面设计的问题,要实现文字两端对齐的效果.在网上搜索了一下,用的都是类似的技巧: text-align:justify;text-justify:inter-ideogra ...
- 【】小技巧】CSS文字两端对齐
需求如下,红框所在的文字有四个字的.三个字的.两个字的,如果不两端对齐可以选择居中对齐,或者右对齐.但是如果要像下面这样两端对齐呢? 我相信以前很多人都这么干过:两个字中间使用 来隔开达到四个字的宽度 ...
- 【小技巧】css文字两端对齐
一.文字两端对齐方法: text-align-last: justify; 二.举个丽子: 三.效果如下: 四.注意: 要使文字在容器中两端对齐,该容器需要是一个块级元素,要有自己的宽度.
- 实现段落文字两端对齐的css样式
有时候网站中的文字比较多,虽然为父元素设置了宽度,但是总是会出现两端参差不齐的情况,看起来不整齐.其实实现段落的两端对齐,只需要设置两个css 样式即可. .demo{ text-align: jus ...
- css实现表单label文字两端对齐
如图,在我们写页面的时候,经常遇到这种的情况,而需求是想让label文字两端对齐,我们来看看如何用css解决 /**css代码**/ ul li{ list-style: none; } .info- ...
- 【原】css实现两端对齐的3种方法
说到两端对齐,大家并不陌生,在word.powerpoint.outlook等界面导航处,其实都有一个两端对齐(分散对齐)的按钮,平时使用的也不多,我们更习惯与左对齐.居中对齐.右对齐的方式来对齐页面 ...
- css实现两端对齐的3种方法
两端对齐在移动端非常见,说到两端对齐,大家并不陌生,在word.powerpoint.outlook等界面导航处,其实都有一个两端对齐(分散对齐)的按钮,平时使用的也不多,我们更习惯与左对齐.居中对齐 ...
随机推荐
- WPF中弹出文件夹浏览对话框
附一个共享目录正则表达式判断: bool result= System.Text.RegularExpressions.Regex.IsMatch("\\pc-test\share" ...
- Android 自定义 view(四)—— onMeasure 方法理解
前言: 前面我们已经学过<Android 自定义 view(三)-- onDraw 方法理解>,那么接下我们还需要继续去理解自定义view里面的onMeasure 方法 推荐文章: htt ...
- Android Animation(动画)
前言 Android 平台提供实现动画的解决方案(三种) 一.3.0以前,android支持两种动画: (1)Frame Animation:顺序播放事先做好的图像,与gif图片原理类似,是一种逐帧动 ...
- No compiler is provided in this environment. Perhaps you are running on a JRE ra
No compiler is provided in this environment. Perhaps you are running on a JRE ra,有需要的朋友可以参考下. 控制台输出的 ...
- linux-bash shell学习
什么是shell?shell就相当于是计算机给我提供的一个操作系统的接口,这里说的bash shell是一种命令行方面的软件,提供给用户来操作系统.
- struts 异常机制
1.try-catch 在Action中通过try-catch捕获异常,在catch中返回字符串, 通过返回的字符串在Action的result元素中进行匹配,最终返回响应的页面 2. 局部异常映射 ...
- [转]九个Console命令,让js调试更简单
转自:九个Console命令,让js调试更简单 一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html ...
- Linux_用户级_常用命令(4):cp
Linux_用户级_常用命令之cp 开篇语:懒是人类进步的源动力 本文原创,专为光荣之路公众号所有,欢迎转发,但转发请务必写出处! Linux常用命令第二集包含命令:cp 格式 cp [-optio ...
- 一个section刷新 一个cell刷新
一个section刷新 一个cell刷新 //一个section刷新 NSIndexSet *indexSet=[[NSIndexSet alloc]initWithIndex:2]; [tabl ...
- Bootstrap 模态框(Modal)插件
原文链接:http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html Bootstrap 模态框(Modal)插件 模态框(Modal)是覆 ...