<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <style>

    .clearfix:after {

        content: '';

        display: table;

        clear: both;

    }

    .clearfix {

        *zoom: 1;

    }

    .cr {

        background-color: red;

    }

    .cg {

        background-color: green;

    }

    .float-left {

        float: left;

        margin-right: 10px;

        width: 100px;

        height: 300px;

    }

    .auto-right {

        display: table-cell;

        width: 10000px;

        height: 200px;

    }

    .fixed-table {

      font-size: 40px;

      display: table;

      table-layout: fixed;

      width: 100%;

    }

    .fixed-table div {

      overflow: hidden;

      text-overflow: ellipsis;

    }

    </style>

</head>

<body>

    <div class="clearfix">

        <div class="float-left cr"></div>

        <div class="auto-right cg">

          <div class="fixed-table">

            <div>

                ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff

            </div>

          </div>

        </div>

    </div>

</body>

</html>

display: table-cell里面文字打点的方法的更多相关文章

  1. [转]基于display:table的CSS布局

    当IE8发布时,它将支持很多新的CSS display属性值,包括与表格相关的属性值:table.table-row和table-cell,它也是最后一款支持这些属性值的主流浏览器.它标志着复杂CSS ...

  2. css Table布局：基于display:table的CSS布局

    两种类型的表格布局 你有两种方式使用表格布局 -HTML Table(<table>标签)和CSS Table(display:table 等相关属性). HTML Table是指使用原生 ...

  3. CSS display:table属性用法- 轻松实现了三栏等高布局

    display:table:此元素会作为块级表格来显示(类似 <table>); display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签.目前IE8+以 ...

  4. VUE2.0 饿了吗视频学习笔记（七-终）：compute,循环,flex,display:table

    一.star组件使用到了computed属性 computed相当于属性的一个实时计算,当对象的某个值改变的时候,会进行实时计算. computed: { starType() { return 's ...

  5. display:table和display:table-cell结合使用

    .GoodList{ display :table; height :54px; width :56px; line-height: 14px                 padding: 0 1 ...

  6. display:table和display:table-cell的妙用

    display的table和table-cell一般情况下用的不多,所以很少有人去关注它,但他们两个联手起来会给你惊喜! 这里抛出这样一个问题,如下,让块里的多行文字垂直居中?一说到垂直居中就会想到, ...

  7. display:table的几个妙用：垂直居中、浮动……

    一.为什么不用table系表格元素? 目前,在大多数开发环境中,已经基本不用table元素来做网页布局了,取而代之的是div+css,那么为什么不用table系表格元素呢? 1.用DIV+CSS编写出 ...

  8. display:table布局总结

    1. table布局方式 2. table布局实际应用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...

  9. display:table / display:table-cell 用法

    display:table  元素会作为块级表格来显示(类似table):表格前后带有换行符: display:table-cell 元素会作为表格单元格来显示(类似<td> 和 < ...

随机推荐

  1. 以rem为单位，数值较小，border-radius：50%部分浏览器渲染不圆方法

    元素使用rem做单位且较小时,对于border-radius:50%在部分浏览器不圆解决方法: 1.将原来宽高扩大至两倍(.1rem --> .2rem),再使用transform:scale( ...

  2. Nginx的mirror指令能干啥？

    mirror 流量复制 Nginx的 mirror 指令来自于 ngx_http_mirror_module 模块 Nginx Version > 1.13.4 mirror 指令提供的核心功能 ...

  3. python之贪婪算法

    贪婪算法 贪婪算法也称为最优算法,这种算法并不是最准确的答案,但确认最接近答案的近似算法. 这时候有人会问,不是最准确的答案我要她干嘛?但是在日常中,我们有时候会遇到一些我们无法处理的问题,甚至是要花 ...

  4. Spring Security之短信登录

    实现短信验证码登录 前面实现了 用户名+密码 的登录方式,现在实现一下短信验证码登录. 开发短信验证码接口 短信验证码和图形验证码类似,用户从手机短信得到验证码和从图片得到验证码类似. 校验短信验证码 ...

  5. 安装Python到Linux（Pyenv）

    pyenv是一个多Python版本的托管工具,我们可以使用它安装Python和随意的切换系统环境中默认使用的Python版本. 运行环境 系统版本:CentOS Linux release 7.6.1 ...

  6. Python模块Ⅰ

    Python模块Ⅰ part1 模块的定义/取别名 自定义模块 什么是模块:模块的本质就是.py文件,封装语句的最小单位 模块中出现的变量,for循环,if结构,函数定义...称为模块成员 模块的运行 ...

  7. go-zero 微服务实战系列（一、开篇）

    前言 在社区中经常看到有人问有没有基于 go-zero 的比较完整的项目参考,该类问题本质上是想知道基于 go-zero 的项目的最佳实践.完整的项目应该是一个完整的产品功能,包含产品需求.架构设计. ...

  8. linux运维基础1

    内容概要 运维简介 运维岗位职责 服务器 服务器硬件介绍 磁盘阵列 虚拟化软件及环境 虚拟化软件 安装操作系统 Vmware虚拟机安装及相关配置流程 内容详情 运维简介 运维岗位职责 核心:运行维护应 ...

  9. 【原创】SpringBoot 2.7.0通过lettuce及commons-pool2 v2.9.0集成Redis踩坑记录

    背景 公司的一个项目由于HTTPS证书到期,导致小程序.POS不能正常使用.所以百度了下,通过URL检测证书有效期的代码,并自行整合到一个服务中. 代码仓库:[基于SpringBoot + 企业微信 ...

  10. Mac Book安装Windows发烫的问题

    Mac Book安装Windows后,电脑发烫,风扇一直高速旋转.针对此问题百度搜索了一下, 大多数人说更改电源选项,由"平衡"模式改为"节能"模式,亲身体验了 ...