我想作为一个前端工作者,总会遇到这样的场景,一个表单展示的字段标题有4个字也有2个字的时候,这样子同时存在想展示的美观一点,就需要字体两端对齐了,其实实现方式很简单,我针对其中一种来做下介绍,以后方法在补上更新。

html  :

 <p class="cell-label-text"></p>

css  :

.cell-label-text{

  width:2rem;

text-aligh:justify;

overflow:hidden;

 }

.cell-label-text:after{

  display:inline-block;

content:"";

    width:2rem;

text-aligh:justify;

overflow:hidden;

}

css 字体两端对齐的更多相关文章

  1. 【原】css实现两端对齐的3种方法

    说到两端对齐,大家并不陌生,在word.powerpoint.outlook等界面导航处,其实都有一个两端对齐(分散对齐)的按钮,平时使用的也不多,我们更习惯与左对齐.居中对齐.右对齐的方式来对齐页面 ...

  2. css文字两端对齐

    css文字两端对齐 text-align:Justify(火狐); text-justify:inter-ideograph(IE) text-justify(IE) 基本语法 text-justif ...

  3. css实现两端对齐的3种方法

    两端对齐在移动端非常见,说到两端对齐,大家并不陌生,在word.powerpoint.outlook等界面导航处,其实都有一个两端对齐(分散对齐)的按钮,平时使用的也不多,我们更习惯与左对齐.居中对齐 ...

  4. CSS实现两端对齐效果

    CSS实现两端对齐效果 两端对齐,从概念上来说,其实不难理解.如果不明白什么叫两端对齐,可以玩玩word等办公软件. 下面谈谈如何实现文本的两端对齐.我所知道的大概有以下几种方法 text-align ...

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

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

  6. CSS图片两端对齐,自适应列表布局末行对齐修复实例页面

    写在前面 前端开发,图片两端对齐,是十分常见的,也是十分痛苦的,我试过好多方法,通过整理,认为下面还是比较靠谱的,在实践中大家可以试试,欢迎一起学习,一起进步 HTML代码 HTML代码非常简单,用的 ...

  7. css 文本两端对齐

    在做表单时我们经常遇到让上下两个字段对齐的情况,比如姓名, 手机号码, 出生地.这样我们就要用到 text-align, text-justify样式了. text-align直接设为justify就 ...

  8. css实现两端对齐~

    今天做表单时遇到让上下两个字段对齐的情况,手机号码.用户名. 然后今天在网上找了找相关方法,发现确实是没有什么好的方法解决,特别是当需要兼容的时候.找到了两个我觉得相对还不错的方法: 方法一.是在司徒 ...

  9. 可用的CSS文字两端对齐

    最近在工作项目中接触到Web界面设计的问题,要实现文字两端对齐的效果.在网上搜索了一下,用的都是类似的技巧: text-align:justify;text-justify:inter-ideogra ...

随机推荐

  1. Java进阶(三十一) Web服务调用

    Java进阶(三十一) Web服务调用 前言 有朋友问了一个问题:如何调用已知的音乐服务接口,服务文档如下: https://www.evernote.com/shard/s744/sh/c37cd5 ...

  2. C语言中的内存分配

    对于一个C语言程序而言,内存空间主要由以下几个部分组成: 1)程序代码区:用来存储程序的二进制代码 2)全局区/静态存储区 3)BSS段:用来存储未初始化的全局变量和静态变量. 4)栈区:存储局部变量 ...

  3. TCP/IP入门(2) --网络层

    /** 本篇博客由 126(127不可用) 2^24 -2 B 2^14 -1 128.1 191.255 2^16 -2 C 2^21 -1 192.0.1 223.255.255 2^8 -2 D ...

  4. Socket编程实践(5) --TCP粘包问题与解决

    TCP粘包问题 由于TCP协议是基于字节流且无边界的传输协议, 因此很有可能产生粘包问题, 问题描述如下 对于Host A 发送的M1与M2两个各10K的数据块, Host B 接收数据的方式不确定, ...

  5. iOS 使用AVAudioPlayer开发录音功能

    最近要做一个类似对讲的功能,所以需要用到录音上传,然后再播放的功能. 一.音频格式分析 因为之前没研究过音频这块,所以很多音频格式都是第一次见. AAC: AAC其实是"高级音频编码(adv ...

  6. [Java]数组排序-选择排序 冒泡排序 插入排序

    1 选择排序  原理:a 将数组中的每个元素,与第一个元素比较          如果这个元素小于第一个元素, 就将这个         两个元素交换.       b 每轮使用a的规则, 可以选择出 ...

  7. Ext JS 5初探(一)

    在开始前,先安装好Sencha Cmd 5.然后输入以下命令创建一个测试用的应用程序: sencha -sdk c:\ext5 generate app TestExt5 C:\TestExt5 想不 ...

  8. java 编程性能调优

    一.避免在循环条件中使用复杂表达式 在不做编译优化的情况下,在循环中,循环条件会被反复计算,如果不使用复杂表达式,而使循环条件值不变的话,程序将会运行的更快. 例子: import java.util ...

  9. Struts2技术内幕 读书笔记二 web开发的基本模式

    最佳实践 在讨论基本模式之前,我们先说说一个词:最佳实践 任何程序的编写都得遵循一个特定的规范.这种规范有约定俗称的例如:包名全小写,类名每个单词第一个字母大写等等等等;另外还有一些需要我们严格遵守的 ...

  10. Linux - 延伸正则表达式

    RE 字符 意义与范例 + 意义:重复『一个或一个以上』的前一个 RE 字符 范例:搜寻 (god) (good) (goood)... 等等的字串. 那个 o+ 代表『一个以上的 o 』所以,底下的 ...