<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>溢出文本</title>

    <style>

        dl{

            width:240px;

            border:solid 1px #ccc;

        }

        dt{

            padding:8px 8px;

            font-size: 13px;

            text-align: left;

            font-weight: bold;

            color:#71790C;

            margin-bottom: 12px;

            border-bottom: solid 1px #efefef;

        }

        dd{

            font-size: 0.78em;

            height:1.5em;

            width:220px;

            padding:2px 2px 2px 18px;

            margin:2px 0;

            /*主要作用*/

            white-space: nowrap;

            overflow: hidden;

            -o-text-overflow: ellipsis;

            text-overflow: ellipsis;

            -moz-bingding:url('ellipsis.xml#ellipsis');

        }

    </style>

</head>

<body>

    <dl>

        <dt>收藏新闻</dt>

        <dd>钱币|5ku司彩银虎币价值几何 三连8豹子钞市值达千元</dd>

        <dd>海外|英国美术馆办窥视模特洗澡展 探秘荷兰人体博物馆</dd>

        <dd>藏界|地产商谈收藏：跟拿地异曲同工 拾垃圾的老外</dd>

    </dl>

</body>

</html>

CSS 溢出文本的更多相关文章

  1. CSS溢出文本省略（text-overflow）

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. css 溢出文本显示省略号

    这个标题其实已经是一个老生常谈的问题了.很多时候,比如网站最基本的文章列表,标题会很长,而显示列表的区域宽度却没有这么宽,这时候最正常的做法就是 让超出宽度的部分文字用省略号(…)来表示.通常做法是网 ...

  3. css溢出文本显示省略号

    css div { width: 200px; height: 200px; border: 1px solid; /* 以下四条缺一不可 其中 display:block 为隐藏条件 */ disp ...

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

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

  5. CSS 单行溢出文本显示省略号...的方法（兼容IE FF）（转）

    http://www.52css.com/article.asp?id=602 ===================================================     html ...

  6. 新公司入职第一天遇到的 关于 CSS 单行溢出文本显示省略号...的问题

    上班第一天 前端岗位,因为公司这个项目是标准开发 所以没法用框架在打架页面,好吧 我手写 各种div 各种css样式 好不忧伤,好吧 不废话了 进入正题. 想在导航栏中的 客户信息 功能点 实现溢出用 ...

  7. CSS学习笔记：溢出文本省略（text-overflow）

    原文:CSS学习笔记:溢出文本省略(text-overflow) 在CSS3中,text-overflow属性的基本语法如下: clip:表示不显示省略文本,简单的裁切. ellipsis:表示对象文 ...

  8. css基础 -文本溢出 text-overflow:ellipsis;

    .className{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;} 外部结构如下是就失效了:(移动端) <a class ...

  9. CSS单行文本溢出显示省略号

    此为转载,原文地址 项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英 ...

  10. CSS 技巧一则 -- 不定宽溢出文本适配滚动

    在日常布局当中,肯定经常会遇到文本内容超过容器的情况.非常常见的一种解决方案是超出省略. 但是,有的时候,由于场景的限制,可能会出现在一些无法使用超出打点省略的方法的场景,譬如在导航栏中: 这种情况下 ...

随机推荐

  1. Java 内存分析（程序实例），学会分析内存，走遍天下都不怕！！！

    相信大多数的java初学者都会有这种经历:碰到一段代码的时候,不知该从何下手分析,不知道这段代码到底是怎么运行最后得到结果的..... 等等吧,很多让人头疼的问题,作为一名合格的程序员呢,遇到问题一定 ...

  2. RabbitMQ 07 发布订阅模式

    发布订阅模式 发布订阅模式结构图: 比如信用卡还款日临近了,那么就会给手机.邮箱发送消息,提示需要去还款了,但是手机短信和邮件发送并不一定是同一个业务提供的,但是现在又希望能够都去执行,就可以用到发布 ...

  3. HarmonyOS应用兼容稳定性云测试

      兼容性测试 兼容性测试主要验证HarmonyOS应用在华为真机设备上运行的兼容性问题,包括首次安装.再次安装.启动.卸载.崩溃.黑白屏.闪退.运行错误.无法回退.无响应.设计约束场景.具体兼容性测 ...

  4. sql 语句系列(用魔法打败魔法)[八百章之第十章]

    前言 下面是一些常规的运维手段. 查询每个表的行数 SELECT a.name, a.object_id, b.rows, b.index_id FROM sys.tables AS a INNER ...

  5. 接口API用例自动转locust测试用例

    做接口测试是必要的,写完接口测试用例,再写locust压测脚本,其实差异不大: 写个简单的py,把接口测试脚本转为locust压测脚本,本例只是简单的示范: 原接口校验脚本: 1 # -*- codi ...

  6. 构建RAG应用-day01: 词向量和向量数据库 文档预处理

    词向量和向量数据库 词向量(Embeddings)是一种将非结构化数据,如单词.句子或者整个文档,转化为实数向量的技术. 词向量搜索和关键词搜索的比较 优势1:词向量可以语义搜索 比如百度搜索,使用的 ...

  7. Webpack Proxy工作原理？为什么能解决跨域?

    一.是什么 webpack proxy,即webpack提供的代理服务 基本行为就是接收客户端发送的请求后转发给其他服务器 其目的是为了便于开发者在开发模式下解决跨域问题(浏览器安全策略限制) 想要实 ...

  8. Redis基础(一)——字符串、hash类型的基本使用

    day09--Redis Redis介绍和安装 # Redis:软件,存储数据的,速度非常快,Redis是一个key-value存储系统(没有表的概念),cs架构的软件 服务端 客户端(python作 ...

  9. 一道SQL面试题

    表结构如下 是一张递归格式的表 使用SQL转换成如下格式 SQL实现 使用SQL转换成上图的格式 SQL代码: WITH T_Recur AS ( SELECT Id,1 num, cast(name ...

  10. 全链路灰度新功能：MSE 上线配置标签推送

    简介: 本文介绍了全链路灰度场景给配置管理带来的问题,介绍了 MSE 针对这一场景的解决方案,并通过实践的方式展示了配置标签推送的使用流程.后续,MSE 还会针对配置治理做更多的探索,帮助用户更好地解 ...