美文网首页
CSS样式设置省略号和换行

CSS样式设置省略号和换行

作者: 魔主恋上九尾狐 | 来源:发表于2020-03-02 16:32 被阅读0次

/*换行*/

/*

* 多行省略号

*/

.ellipsis-2-pk {

    /* autoprefixer: off */

    overflow:hidden;

    text-overflow:ellipsis;

    display:-webkit-box;

    -webkit-box-orient:vertical;

    -webkit-line-clamp:2;

}

.ellipsis-3-pk {

    /* autoprefixer: off */

    overflow:hidden;

    text-overflow:ellipsis;

    display:-webkit-box;

    -webkit-box-orient:vertical;

    -webkit-line-clamp:3;

}

.ellipsis-single-pk {

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

}

.break-all-pk {

    word-break:break-all;

}

.break-word-pk {

    word-break:break-word;

}

/*常用按钮*/

/*白色背景,红色边框*/

.btnLine-small-red {

    display:inline-block;

    box-sizing:border-box;

    width:80px;

    height:30px;

    line-height:28px;

    border-radius:30px;

    border:1px solid #D82D11;

    color:#D82D11;

    font-size:15px;

    text-align:center;

    background:#ffffff;

}

相关文章

  • CSS样式设置省略号和换行

    /*换行*/ /* * 多行省略号 */ .ellipsis-2-pk { /* autoprefixer: ...

  • 实用css

    标签: css 正文 1.图像灰度 2.文本自动换行 3.模糊文本 4.css动态省略号 5.样式重置 6.通用媒...

  • [jQuery]设置css样式

    获取css样式 设置单个css样式 设置多个css样式

  • vue 将一大串文字分两行显示,超出用省略号表示

    众所周知,通过css设置文字强制不换行超出用省略号表示很简单: 但是如果要想显示两行,超出用省略号表示要怎么写呢?...

  • jQuery获取设置样式

    css();方法 获取或设置样式 对以下html标签进行样式的获取和设置 获取样式 css();方法设置参数,...

  • CSS零碎

    CSS自动换行、强制不换行、强制断行、超出显示省略号 使用white-space属性强制不换行p { white-...

  • css 设置连续数字、连续英文字母强制换行和多行显示省略号的方法

    1、设置连续数字和连续英文字母换行 2、设置显示省略号方法 一行显示省略号的方法,如下: 多行显示省略号的方法,如...

  • 初学html 笔记

    1、元素标签,如p,当宽度、高度固定,内容超出时显示省略号。 需设置css样式: white-space: now...

  • 杂记

    页面中中文标点符号换行问题,可以在CSS中设置父级div: span标签自助换行: 自定义格子标签布局:以下样式是...

  • CSS整理库

    单行溢出省略号 多行溢出省略号 纯 CSS 实现高度与宽度成比例的效果 强制换行

网友评论

      本文标题:CSS样式设置省略号和换行

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