<!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. Bert不完全手册5. 推理提速？训练提速!内存压缩！Albert

    Albert是A Lite Bert的缩写,确实Albert通过词向量矩阵分解,以及transformer block的参数共享,大大降低了Bert的参数量级.在我读Albert论文之前,因为Albe ...

  2. CSAPP 之 AttackLab 详解

    前言 本篇博客将会介绍 CSAPP 之 AttackLab 的攻击过程,利用缓冲区溢出错误进行代码注入攻击和 ROP 攻击.实验提供了以下几个文件,其中 ctarget 可执行文件用来进行代码注入攻击 ...

  3. 论文解读《Bilinear Graph Neural Network with Neighbor Interactions》

    论文信息 论文标题:Bilinear Graph Neural Network with Neighbor Interactions论文作者:Hongmin Zhu, Fuli Feng, Xiang ...

  4. 题解 P3831 [SHOI2012]回家的路

    什么叫分层图最短路,我不会/kk 感觉自己做法和其他题解不大一样所以过来发篇题解了. 未刻意卡常拿下最优解 题目大意 就是说给你一个 \(n \times n\) 的网格图和 \(m\) 个可换乘点, ...

  5. LowDB采坑记录（主要为lowdb3.0的Cannot find module和lowdb1.0 node不断自启动的问题）

    bug1: Error [ERR_ MODULE_ NOT_ FOUND]: Cannot find module 在使用最新版LowDB(3.0)时,发现typescript中直接引用模块名(如以下 ...

  6. spring boot 在控制台打印banner

    转自 SpringBoot系列--花里胡哨的banner.txt - huanzi-qch - 博客园 (cnblogs.com) <div id="cnblogs_post_body ...

  7. Eclipse for C/C++ 开发环境部署保姆级教程

    Eclipse for C/C++ 开发环境部署保姆级教程 工欲善其事,必先利其器. 对开发人员来说,顺手的开发工具必定事半功倍.自学编程的小白不知道该选择那个开发工具,Eclipse作为一个功能强大 ...

  8. 技术分享 | 想做App测试就一定要了解的App结构

    本文节选自霍格沃兹测试开发学社内部教材 app 的结构包含了 APK 结构和 app 页面结构两个部分 APK结构 APK 是 Android Package 的缩写,其实就是 Android 的安装 ...

  9. .Net Core 企业微信更新模版卡片消息

    1.搭建回调服务器 可参考:https://www.cnblogs.com/zspwf/p/16381643.html进行搭建 2.编写代码 2.1接口定义 应用可以发送模板卡片消息,发送之后可再通过 ...

  10. SAP Word97 Intergration

    *&---------------------------------------------------------------------* *& Report SAPRDEMOW ...