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 ...
随机推荐
- Core源码(二) Linq的Distinct扩展
先贴源码地址 https://github.com/dotnet/corefx/tree/master/src/System.Linq/src .NET CORE很大一个好处就是代码的开源,你可以详细 ...
- python+java蓝桥杯ACM日常算法题训练(一)10基础题
目录 1.简单的a+b 2.第一个HelloWorld程序! 3.三个数最大值 4.密码破译 5.母牛的故事 6.7.8.9.10 @(这里写自定义目录标题) 算法题训练网站:http://www.d ...
- bower私服部署
目录 bower私服部署 简介 工具清单 安装 安装nodejs 安装git 安装private-bower 配置private-bower 启动private-bower 开放端口 开机启动/注册为 ...
- CVE-2019-0708-BlueKeep漏洞复现
环境 攻击机:Kali Linux IP:192.168.0.108 靶机:Windows Sever 7 SP1 旗舰版 IP:192.168.0.109 Exploit: https://gith ...
- ABP进阶教程2 - 组合查询
点这里进入ABP进阶教程目录 更新数据传输对象 打开应用层(即JD.CRS.Application)的Course\Dto\GetAllCoursesInput.cs //Course数据传输对象(查 ...
- 我认为现代IDE编辑器应该具有的几个特性和Visual studio 2010增强
工作中要使用 VS 2010, 有好多年没有使用Visual studio 了, 试了一小会, 发现VS 2010 缺少不少现代IDE应有的特性, 我认为重要的是下面几个特性, VS2010 已经是1 ...
- REST API的使用
需求描述 GET: http://localhost:8080/MyWebsite/user/ Header: Content-Type = application/json Body: 空 Resp ...
- [20190524]DISABLE TABLE LOCK(12c).txt
[20190524]DISABLE TABLE LOCK(12c).txt --//如果禁止table lock时,一些ddl操作会被禁止.但是我有点吃惊的是增加字段不受限制.--//链接:http: ...
- 5.JavaCC官方入门指南-概述
一.前言 在最开始使用JavaCC的时候,从网上查询了许多资料,但是网上的资料水平是参差不齐的,走了许多弯路,不得已自己查阅了英文版官网文档.令我伤心的是最后我回过头来再看那些博客资料时,发现其实 ...
- CPU与GPU基础知识与品牌
1 CPU信息 ubuntu系统: lscpu 序号 属性 描述 1 架构 x86_64 2 CPU 运行模式 32-bit, 64-bit 3 字节序 Little Endian 4 CPU内核数量 ...