首页 > 其他分享 >文字显示一行或2行 并省略

文字显示一行或2行 并省略

时间:2024-04-26 14:13:42浏览次数:24  
标签:文字 box 省略 text 一行 orient webkit overflow hidden

1. 强制一行的情况很简单

overflow:hidden;//超出的隐藏

text-overflow:ellipsis;//省略号

white-space:nowrap;//强制一行显示

 

2. 如果要强制两行的话,得用到css3的知识

overflow:hidden;

text-overflow:ellipsis;

display:-webkit-box;

-webkit-box-orient:vertical;

-webkit-line-clamp:2;

在实际项目中,我们会发现-webkit-box-orient没有生效,需要加入如下注释

/*! autoprefixer: off */

最终代码:

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;

-webkit-line-clamp: 2;

overflow:hidden;

/*! autoprefixer: off */

-webkit-box-orient: vertical;

 

标签:文字,box,省略,text,一行,orient,webkit,overflow,hidden
From: https://www.cnblogs.com/bruce-lee-blog/p/18159942

相关文章

  • 几种中文字体的比较
    根据自己的喜好给常见的几个中文字体的打分:字体选项字体名得分adobeAdobe宋体Std5fandolFandolSong0founder方正书宋_GPK10hanyi汉仪宋体6sinotype华文宋体3win中易宋体9fandol缺少偏僻字体,故得零分。......
  • vba复制一行到另一个工作表
    SubCopyRowToAnotherSheet()DimwsSourceAsWorksheetDimwsDestinationAsWorksheet'设置源和目标工作表SetwsSource=ActiveSheetSetwsDestination=ThisWorkbook.Worksheets("Sheet2")'假设我们要复制的是第一行......
  • chsime.exe 是 Windows 系统中的一个文件,它是中文输入法编辑器的主要执行文件。这个文
    chsime.exe是Windows系统中的一个文件,它是中文输入法编辑器的主要执行文件。这个文件通常用于启动和管理中文输入法,使用户能够在Windows系统中输入中文字符。通常情况下,当用户需要在Windows系统中输入中文时,他们可以通过点击任务栏上的语言栏或使用快捷键切换到中文输......
  • postgresql中两张表的聚合函数合并到一列或一行,做除法,并保留两位小数
    --两张表的无关数据合并到一张表SELECTA.name,B.nameFROM(selecto.name,row_number()over(orderbyname)fromtb_orgaso)A FULLJOIN (selectr.name,row_number()over(orderbyr.name)fromtb_regionasr)BONA.row_number=B.row_number;这里是利用......
  • VGA显示文字
    VGA显示文字VGA字符显示的原理把要显示的字符转换成字符点阵,然后编码存储,着色的部分为1,其它为0.然后在VGA上输出显示。  字符点阵生成软件:https://www.zhetao.com/fontarray.html这里一个字符为32*32bit,字符点阵如下图:  字符编码存到内存里的代码如下: //chardo......
  • 文字动态地变大变小(CSS)
    要在CSS中动态地改变文字大小,可以使用@keyframes规则创建一个动画,然后将该动画应用到需要改变大小的文本元素上。以下是一个示例,演示如何使文字大小在一定时间内从小变大,然后再变小:css部分:/*定义一个名为resizeText的动画*/@keyframesresizeText{0%{font-si......
  • 在线文字转语音网站,配音,语音合成,语音克隆
    无界智能·语音合成·在线语音合成(aiwjzn.com)【打造声音魅力,让文字活起来】......
  • linux系统文字编码,通过命令设置为utf8编码
    转自:https://worktile.com/kb/ask/489959.html要将Linux系统设置为UTF-8编码,可以通过以下步骤进行:1.检查系统当前的默认字符集。在终端中输入以下命令并查看输出:“`locale“`如果输出中的LC_ALL或LANG字段不以UTF-8结尾,则系统默认字符集不是UTF-8。2.编辑本地......
  • Word中一行文字,一部分文字居左,一部分文字居右
    这里使用的是WPS,office操作也一样。最终效果图  第一步,先把标尺选中(位置:视图》标识) 第二步,创建2个位置的制表符(0代表居最左边,43.2代表居最右边,以当前纸张的规格为准),弹出制表符窗体有两种方式方式1:点击下图的红色粗行,只要是红色粗行平行线都可以点击,点击后会有一个......
  • 常用directive,防止重复点击,点击盒子外部触发的事件,不换行省略号 ,移上去显示详情
    importVuefrom"vue";importstorefrom"../../store";import{debounce}from"throttle-debounce";Vue.directive("demo",{bind:function(el,binding,vnode){console.log("bind");vars=JSO......