美文网首页
HTML-让字体在一行内显示不换行

HTML-让字体在一行内显示不换行

作者: 斌雅读书 | 来源:发表于2019-06-09 22:21 被阅读0次
        /*一般的文字截断(适用于内联与块):*/
        /*@author zhenyuya <zhenyuya@163.com>*/
        .text-oneLine{
            display:block;            /*内联对象需加*/
            word-break:keep-all;      /* 不换行 */
            white-space:nowrap;       /* 不换行 */
            overflow:hidden;          /* 内容超出宽度时隐藏超出部分的内容 */
            text-overflow:ellipsis;   /* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
        }
        /*对于表格,定义有所不同:*/
        /*@author zhenyuya <zhenyuya@163.com>*/
        table{
            width:30px;
            table-layout:fixed;      /* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */
        }
        td{
            width:100%;
            word-break:keep-all;     /* 不换行 */
            white-space:nowrap;      /* 不换行 */
            overflow:hidden;         /* 内容超出宽度时隐藏超出部分的内容 */
            text-overflow:ellipsis;  /* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
        }

相关文章

  • HTML-让字体在一行内显示不换行

  • 小技巧1

    加粗字体斜体显示 行内高亮显示 多行高亮显示 表格 引用 枪如惊雷,照一身肝胆 ---赵云

  • 前端学习0316

    1.块集元素和行内元素 行内元素换行时,会有一个字体大小的空格。 2.盒模型 box-sizing:border-...

  • html的部分标签

    行内元素列表: a 超链接,可定义锚 span 行标签 b 字体加粗 br 换行 em 强调的内容 img 嵌入图...

  • [译]raywenderlich.com官方的swift风格指南

    函数声明 让函数声明短到能在一行内显示,包括左花括号: 对于一些比较长的函数声明,可以在适当的地方换行,同时要在子...

  • 如何消除div之间的间隙

    原因:浏览器解析的时候,会把行内元素(包括行内块元素)之间的回车换行符解析成一定的间隙,间隙的大小跟默认的字体大小...

  • css--文字不换行 隐藏文字显示…

    css--文字不换行 隐藏文字显示… 强制换行 iview气泡提示语背景填充黑色下拉框的placeholder字体...

  • CSS引入方式

    1、行内引入 2、内部引入 将CSS定义在head内 3、外部引入 单独编写CSS文件 在HTML->HEAD中引...

  • css:文字超长后显示为 "..."

    给定宽度(即块级元素)的标签,内容过多时会自动换行显示 此时,需要显示单行内容的标签中超出的文字就会显示成 “.....

  • 前端学习笔记八

    Css单位与文字排版 一、标签的类型(显示模式) 1,行内元素 1.1,行内元素仅仅靠自身的字体大小和图像尺寸来支...

网友评论

      本文标题:HTML-让字体在一行内显示不换行

      本文链接:https://www.haomeiwen.com/subject/efsoxctx.html