只显示一行文字

overflow: hidden;

text-overflow:ellipsis;

white-space: nowrap;

显示多行文字

word-break:break-all;

display:-webkit-box;

-webkit-line-clamp:2;/*控制行数*/

-webkit-box-orient:vertical;

overflow:hidden;

css实现文字多余显示省略号的更多相关文章

  1. 【CSS】文字超出显示省略号&连续字符换行

    方法1.多行控制(css3) .text { width: 100%; word-break: break-all; display: -webkit-box; -webkit-line-clamp: ...

  2. css 样式文字溢出显示省略号

    在table中使用溢出样式,table样式要设置为”table-layout: fixed“,即<table style="table-layout: fixed;"> ...

  3. CSS解决文字超出显示省略号问题

    超出一行 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 超出多行 overflow: hidden; text-ove ...

  4. CSS文字过多显示省略号

    CSS文字过多显示省略号 /*-webkit-line-clamp用来限制在一个块元素显示的文本的行数*/ .dot1{ width: 100%; display: -webkit-box; -web ...

  5. css文字溢出显示省略号

    1.单行文字溢出显示省略号. overflow: hidden; text-overflow: ellipsis; white-space: nowrap;//文本不换行 2.多行文本溢出显示省略号. ...

  6. CSS换行文本溢出显示省略号

    现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...

  7. --css 控制文字多使用省略号

    --css 控制文字多使用省略号.overflowPoint{ text-overflow:ellipsis;width: 200px;overflow: hidden;}<div class= ...

  8. CSS实现文字半透明显示在图片上方法

    CSS实现文字半透明显示在图片上方法 在css中文字半透明我们会需要使用滤镜效果也就是css中的filter:alpha来实现了,下面来看两个文字显示在图片上并且半透明的例子. CSS让一行文字显示在 ...

  9. CSS 文本和表格中文字溢出显示省略号

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

  10. CSS控制文字只显示一行 超出部分显示省略号

         <p style="width: 120px; height: 50px; border: 1px solid blue; white-space: nowrap; over ...

随机推荐

  1. Windows 安装 Docker 并使用 VS code 连接

    安装前提 Docker是基于linux的,在win10中安装wsl2:Windows Subsystem for Linux,让win10能够原生运行Linux二进制可执行文件的兼容层,且不会产生传统 ...

  2. WDA学习（28）：Drag &Drop使用

    1.21 Drag Drop使用 本实例测试Drag Drop; 运行结果: Drag图标Drop到添加Icon,会将一条记录添加到Table; Drag Table记录Drop到垃圾桶Icon,会将 ...

  3. 配置python库源为清华源

    目录 Windows Ubuntu pip较低版本 pip较高版本 Windows %HOMEPATH%/pip/pip.ini [global] index-url = https://pypi.t ...

  4. 小程序隐藏scroll-view滚动条的方法

    在wxss文件上加上 ::-webkit-scrollbar{ width: 0; height: 0; color: transparent; }

  5. TP开发项目时遇到的问题记录

    1.下载功能. TP自带Http下载类,使用时new一个就行,示例代码: public function download(){ //接收公文id $id = I('get.fid'); //根据公文 ...

  6. 【Java学习Day03】JDK的卸载和JDK8的安装过程

    卸载JDK 右键单击此电脑+R+高级系统设置+N 双击JAVA_HOME+F,删除子文件,再返回删除JAVA_HOME 双击Path,删除有关JAVA_HOMED变量,一直点击确定直至返回 打开CMD ...

  7. 尝试在virtualbox虚拟机中fedora30中实现文件夹共享

    $ sudo dnf install gcc kernel-devel kernel-headers dkms make bzip2 perl $ rpm -qa|grep kernel|sort 确 ...

  8. java向上转型知识点收录

    package tex2polymorphism; /*总结如下: * 对于多态,可以总结它为: 一.使用父类类型的引用指向子类的对象: 二.该引用只能调用父类中定义的方法和变量: 三.如果子类中重写 ...

  9. -behaviour()的使用，他具体有什么作用

    Eralng 编程中的OTP OTP里面创建进程时 常用有四大behaviour • supervisor • gen_server • gen_fsm • gen_event 在erlang的编译器 ...

  10. Oracle重建索引

    创建表 create table student( student_id number, name varchar2(240) ) tablespace school_data; 创建索引 creat ...