带有省略号的段落就是你只能在一行显示一段文字,文字过长是肯定不能完全显示的,如果默认的话,超出的文字会自动换行,撑大盒子。

   1.这时需要设置white-space: nowrap,禁止换行。这样的话,文字就会在一行显示

   2.在一行显示就会有超出的部分,使用overflow: hidden将超出的部分隐藏。

   3.虽然隐藏了,但是有可能最后一个字被挡住一部分,而且我们需要的是省略号,这时再加上text-overflow: ellipsis;就可以将最后改成省略号。

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

利用css实现带有省略号的段落的更多相关文章

  1. 如何利用 jQuery 修改 css 中带有 !important 的样式属性?

    使用 jQuery 修改 css 中带有 !important 的样式属性 外部样式为: div.test { width:auto !important; overflow:auto !import ...

  2. 利用CSS实现带相同间隔地无缝滚动动画

    说明:因为在移动上主要利用CSS来做动画,所以没有考虑其他浏览器的兼容性,只有-webkit这个前缀,如果需要其他浏览器,请自行补齐. 首先解释一下什么是无缝滚动动画, 例如下面的例子 See the ...

  3. 使用jquery修改css中带有!important的样式属性

    当CSS中含有!important的样式属性时,普通的修改方式是会出现失败的.如下: <div class="test">使用jquery修改css中带有!import ...

  4. 如何利用CSS代码使图片和文字在同一行显示且对齐

    对于初学css的新手朋友来说,经常会遇到这样一个问题,当文字和图片出现在同一行或者同一个div里面的时候,在浏览器中运行出来的显示效果往往是在不同的行,那么,我们怎么才能利用CSS代码使图片和文字在同 ...

  5. Web前端开发如何利用css样式来控制Html中的h1/h2/h3标签不换行

      H1/H2/H3/H4标题标签常常使用在一个网页中唯一标题.重要栏目.重要标题等情形下. H1在一个网页中最好只使用一次,如对一个网页唯一标题使用.H2.H3.H4标签则可以在一个网页中多次出现, ...

  6. 利用css新属性appearance优化select下拉框

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. 利用css的border实现画三角形思路原理

    1.利用Css 的border绘制三角形的原理: div的border是有宽度和颜色的,当div的宽度比较大的时候,比如上面代码每个边100像素,颜色又不一样,浏览器怎么渲染颜色呢?经测试发现,宽度较 ...

  8. css文本超出省略号

    终于完成了项目了,今天我就分享自己在项目中比较实用的一些功能的实现,第一个就是纯css文本超出省略号 /* 文本单行超出省略号 */ .textels { overflow: hidden; text ...

  9. 利用css+原生js制作简易钟表

    利用css+原生js制作简单的钟表.效果如下所示 实现该效果,分三大块:html.javascript.css html部分html部分比较简单,定义一个clock的div,内部有原点.时分秒针.日期 ...

随机推荐

  1. leetCode66:加一

    /** * @param {number[]} digits * @return {number[]} */ var plusOne = function(digits) { if(digits[di ...

  2. python3使用pymysql库连接MySQL的常用操作

    #导入pymysql模块import pymysql #连接数据库connect = pymysql.connect( host='localhost', port=3306, user='root' ...

  3. leetcode每日刷题计划-简单篇day11

    Num 121 买卖股票的最佳时期 Best Time to Buy and Sell Stock class Solution { public: int maxProfit(vector<i ...

  4. Spring Boot实现文件下载功能

    我们只需要创建一个控制器(Controler)文件,即Controller目录下的File_Download.java,其完整目录如下: @Controller public class File_D ...

  5. windows cmd.exe 将程序 stdout 输出到文件中

    问题背景:通过 cmd.exe 调用程序,会有一些输出信息,在 cmd 中不方便查阅,所以需要导入文件中. 例如 方法: 可以在其路径下看到

  6. Java中List的sort排序重写

    最近遇到需要使用list中sort排序功能,list中存的是自己写的类,所以需要重写sort函数,一般实现如下: Collections.sort(voList, new Comparator< ...

  7. HTML - form (转)

    自:http://www.runoob.com <form> 标签 标签定义及使用说明 <form> 标签用于创建供用户输入的 HTML 表单. <form> 元素 ...

  8. Hash算法总结(转)

    1. Hash是什么,它的作用先举个例子.我们每个活在世上的人,为了能够参与各种社会活动,都需要一个用于识别自己的标志.也许你觉得名字或是身份证就足以代表你这个人,但是这种代表性非常脆弱,因为重名的人 ...

  9. document.compatMode 浏览器渲染模式判定利器

    在加了DOCTYPE的页面document.compatMode输出CSS1Compat,不管加的是XHTML的还是HTML5的DOCTYPE.没有加的输出BackCompat. BackCompat ...

  10. 20175213《Java程序设计》实验二Java面向对象程序设计实验报告

    实验内容 1.初步掌握单元测试和TDD 2.理解并掌握面向对象三要素:封装,继承,多态 3.初步掌握UML建模 4.熟悉S.O.L.I.D原则 5.了解设计模式 知识总结 1.伪代码 2.产品代码: ...