CSS 控制文字两端对齐
<html>
<head>
<style>
td:after {
content: '';
}
td p{
font-size: 14px;
width: 5em;/*调整文字间距*/
text-align-last: justify!important;/*自适应文本宽度*/
}
</style>
</head>
<body>
<table>
<tbody>
<tr>
<td> <input type="checkbox" name="SearchChk" id="chk_cgCompanyID" /></td>
<td> <p>出库公司</p> </td>
<td> <input name="CompanyID" id="cgCompanyID" class="easyui-textbox" /></td>
<td> <input type="checkbox" name="SearchChk" id="chk_cgCompanyID" /></td>
<td> <p>设置密码</p></td>
<td> <input name="CompanyID" id="cgCompanyID" class="easyui-textbox" /></td>
</tr>
<tr>
<td> <input type="checkbox" name="SearchChk" id="chk_cgCompanyID" /></td>
<td> <p>确认密码</p></td>
<td> <input name="CompanyID" id="cgCompanyID" class="easyui-textbox" /></td>
<td> <input type="checkbox" name="SearchChk" id="chk_cgCompanyID" /></td>
<td> <p>手机</p></td>
<td> <input name="CompanyID" id="cgCompanyID" class="easyui-textbox" /></td>
</tr>
<tr>
<td> <input type="checkbox" name="SearchChk" id="chk_cgCompanyID" /></td>
<td> <p>邮箱</p></td>
<td> <input name="CompanyID" id="cgCompanyID" class="easyui-textbox" /></td>
</tr>
</tbody>
</table>
</body>
</html>
实现效果

text-justify基本语法
参数:
auto :允许浏览器用户代理确定使用的两端对齐法则 ;
inter-word :通过增加字之间的空格对齐文本,该行为是对齐所有文本行最快的方法,它的两端对齐行为对段落的最后一行无效 ;
newspaper : 通过增加或减少字或字母之间的空格对齐文本,是用于拉丁文字母表两端对齐的最精确格式 ;
distribute :处理空格很像newspaper,适用于东亚文档,尤其是泰国 ;
distribute-all-lines :两端对齐行的方式与distribute相同,也同样不包含两段对齐段落的最后一行,适用于表意字文档 ;
inter-ideograph : 为表意字文本提供完全两端对齐。他增加或减少表意字和词间的空格 。
参考:
https://www.cnblogs.com/sapho/p/5999603.html
https://www.cnblogs.com/nangezi/p/9042973.html
CSS 控制文字两端对齐的更多相关文章
- CSS实现文字两端对齐
最近的项目遇到了这样的需求:(要求标题部分不管文字多少,都必须两端对齐) 如下图: 当时也没有多想直接使用‘ ’进行代替,毕竟产品同学想快一点看到效果,不敢怠慢!不过到第二个页面就傻眼了. 如图: 这 ...
- css text-align文字两端对齐
text-align:start | end | left | right | center | justify | match-parent | justify-all justify: 内容两端对 ...
- 使用css让文字两端对齐
text-align:justify; text-justify:distribute-all-lines; text-align-last:justify;可以让文字实现两端对齐
- css中文字两端对齐兼容IE
text-align: justify; text-justify:inter-ideograph;
- 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样式
有时候网站中的文字比较多,虽然为父元素设置了宽度,但是总是会出现两端参差不齐的情况,看起来不整齐.其实实现段落的两端对齐,只需要设置两个css 样式即可. .demo{ text-align: jus ...
- css实现表单label文字两端对齐
如图,在我们写页面的时候,经常遇到这种的情况,而需求是想让label文字两端对齐,我们来看看如何用css解决 /**css代码**/ ul li{ list-style: none; } .info- ...
- 可用的CSS文字两端对齐
最近在工作项目中接触到Web界面设计的问题,要实现文字两端对齐的效果.在网上搜索了一下,用的都是类似的技巧: text-align:justify;text-justify:inter-ideogra ...
随机推荐
- Spring MVC HTTP406 Not Acceptable
今天在搞前后端分离用springmvc传递json数据的时候,第一步就卡主了,本着完事开头难的做法(哈哈哈), 报了个406?什么鬼? 百度之后发现很多人也同我一样遇到过这个问题,记录下. 找到的处理 ...
- windows7_删除”右键-新建“菜单中的多余项
这边文章比较好用:分享下 https://blog.csdn.net/ddgweb/article/details/17993251 在使用windows7的过程中,由于安装了较多的软件,在桌面或者资 ...
- Linux性能分析——分析系统性能相关的命令
Linux性能分析——分析系统性能相关的命令 摘要:本文主要学习了Linux系统中分析性能相关的命令. ps命令 ps命令用来显示系统中进程的运行情况,显示的是当前系统的快照. 基本语法 ps [选项 ...
- 微信小程序初体验遇到的坑
今天,2017年1月9日凌晨,微信小程序如约上线.2007年1月9日,整整10年前的今天,苹果的iPhone手机正式问世! 经不起新技术的诱惑了,想试着开发一下看看.刚开始遇到很多坑,在这里记录一下, ...
- 如何使用 CODING 进行瀑布流式研发
你好,欢迎使用CODING!这份最佳实践将帮助你通过 CODING 更好地实践瀑布流式开发流程. 什么是瀑布流式研发 1970 年温斯顿·罗伊斯(Winston Royce)提出了著名的"瀑 ...
- css伪类实现行号自动填充
css伪类实现行号自动填充 大多数时候我们需要行号自动填充的时候我们可以 大多数时候是插入元素, 在元素里用js填入行号,或者用 ol > li 实现行号填充, 对于上面的方式,都不太灵活,而且 ...
- MongoDB 最近遇到的几个小问题
(1)连接数据库时报错 ERROR Topshelf.Hosts.ConsoleRunHost.Run An exception occurred System.TimeoutException: A ...
- 更改docker默认网段
#本文档旨在说明创建docker时注意的事项:我们在局域网中使用Docker,最常遇到的一个困惑,就是有时候跨网段结果出现网络不通.原因是因为Docker默认生成的网关和我们的局域网网段有时候是冲突的 ...
- Mysql—用户表详解(mysql.user)
MySQL是一个多用户管理的数据库,可以为不同用户分配不同的权限,分为root用户和普通用户,root用户为超级管理员,拥有所有权限,而普通用户拥有指定的权限. MySQL是通过权限表来控制用户对数据 ...
- Plugin org.apache.maven.plugins:maven-resources-plugin:2.6
创建maven project时工程报错Plugin org.apache.maven.plugins:maven-resources-plugin:2.6 or one of its depende ...