问题

过多的文字会把盒子撑开，造成布局错乱。

解决

    .card-title {

        white-space: nowrap;

        text-overflow: ellipsis;

        overflow: hidden;

    }

效果

CSS - div中的文字不换行，超出宽度就用省略号表示的更多相关文章

  1. 在div中设置文字与内部div垂直居中

    要实现如图一所示的结果: html代码如下: <!DOCTYPE html> <html> <head lang="zh"> <meta ...

  2. 实现全屏轮播，并且轮播div中的文字盒子一直自动垂直居中

    效果如下: 直接上代码了: 说明:轮播图基于swiper.js,自行下载.css在最后 <!DOCTYPE html> <html lang="en"> & ...

  3. div中单行文字垂直水平居中

    1.div中单行文字垂直水平居中.条件:外层div高度已经给定.代码如下: 复制代码代码如下: <style type="text/css">.div3{border: ...

  4. css之div中纯文字单行和多行垂直居中

    先上效果图 <html lang="en"> <head> <meta charset="UTF-8"> <meta ...

  5. css+div如何解决文字溢出

    看到标题你一定很轻易就会想到截断文字加“...”的做法.哈哈,就是这样.其实写这篇日志也只是把这样方法做个记录,因为似乎还有很多人不记得碰到这样的情况该如何处理. 首先,先解释一下,一般用div+cs ...

  6. 禁止鼠标多次点击选中div中的文字

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

  7. 如何让div中的文字只显示一行，多余的文字隐藏并加上省略号（超链接形式）

    写页面的时候遇到了一个小小的问题,如何让div中一行超链接文字只显示一行,多余的文字隐藏并加上省略号,悬浮时隐藏的文字显示出来?解决问题时发现了css3的一个新标签  text-overflow  , ...

  8. css div中内容绝对居中（多行内容）

    div中的内容绝对居中(不适合IE6哦,IE6我已经不考虑了),直接看代码吧. <!DOCTYPE HTML> <html> <head> <title> ...

  9. div中让文字垂直居中

    在div中如何让文字垂直居中? 作者在刚接触web前端开发时就遇到了这个问题,一直没有记录下来,今天正好有空,便记录下来. 为了方便展示,我把style先直接写在了div里. 效果如下图所示: 图1. ...

随机推荐

  1. Linux之温故知新2

    1.关于ssh免密码登陆的ssh-keygen, ssh-copy-id的使用, 然后使用ssh-copy-id user@remote将公钥传给服务器, 以及别名 1 C:\Users\linxmo ...

  2. 高级特征工程II

    以下是Coursera上的How to Win a Data Science Competition: Learn from Top Kagglers课程笔记. Statistics and dist ...

  3. SequoiaDB报告创建线程失败的解决办法

    1.问题背景 对于分布式数据库和分布式环境,高并发和高性能压力的情况下,出现线程创建失败等等问题也是十分常见的,这时候就十分考虑数据库管理员的经验,需要能快速的定位到问题和瓶颈所在,快速解决.本文也是 ...

  4. Oracle 监听器 Listene

    Oracle 监听器 Listener 是一个重要的数据库服务器组件,在整个 Oracle 体系结构中,扮演着重要的作用.它负责管理 Oracle 数据库和客户端之间的通讯,它在一个特定的网卡端口(默 ...

  5. D3新学习

    1. Python Web(1):建立第一个Web项目 直接将d3 index.html代码拷贝进index.html中即可. 2. D3入门教程; D3.js的v5版本入门教程

  6. C++-随机数的产生

    一.随机数 以前学C语言的时候感觉随机数没啥用的,现在想想是自己无知啦,在帮人做一个项目的时候发现随机数还是相当有用的,我们可以利用随机数来生成大量的测试数据. 有两种方法可以让你的程序每次运行结果不 ...

  7. centost redhat 卸载rpm以及yum install 的正确姿势

    先看yum  install 的卸载: 第一列为我们要的包名: 那么要移除必须使用 yum list |grep  collectd | awk '{print $1}' |xargs  yum  r ...

  8. POJ 1330（LCA/倍增法模板）

    链接:http://poj.org/problem?id=1330 题意:q次询问求两个点u,v的LCA 思路:LCA模板题,首先找一下树的根,然后dfs预处理求LCA(u,v) AC代码: #inc ...

  9. scw——02错误initializationError(Runner:JUnit 4)

    代码: 错误: 原因:版本不同,自动生成的代码不同 解决:

  10. Linux平台下C++使用JsonCPP解析Json字符串

    JsonCPP安装 安装 scons 下载地址: http://sourceforge.net/projects/scons/files/scons/2.1.0/scons-2.1.0.tar.gz/ ...