display: table-cell里面文字打点的方法
<!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里面文字打点的方法的更多相关文章
- [转]基于display:table的CSS布局
当IE8发布时,它将支持很多新的CSS display属性值,包括与表格相关的属性值:table.table-row和table-cell,它也是最后一款支持这些属性值的主流浏览器.它标志着复杂CSS ...
- css Table布局：基于display:table的CSS布局
两种类型的表格布局 你有两种方式使用表格布局 -HTML Table(<table>标签)和CSS Table(display:table 等相关属性). HTML Table是指使用原生 ...
- CSS display:table属性用法- 轻松实现了三栏等高布局
display:table:此元素会作为块级表格来显示(类似 <table>); display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签.目前IE8+以 ...
- VUE2.0 饿了吗视频学习笔记（七-终）：compute,循环,flex,display:table
一.star组件使用到了computed属性 computed相当于属性的一个实时计算,当对象的某个值改变的时候,会进行实时计算. computed: { starType() { return 's ...
- display:table和display:table-cell结合使用
.GoodList{ display :table; height :54px; width :56px; line-height: 14px padding: 0 1 ...
- display:table和display:table-cell的妙用
display的table和table-cell一般情况下用的不多,所以很少有人去关注它,但他们两个联手起来会给你惊喜! 这里抛出这样一个问题,如下,让块里的多行文字垂直居中?一说到垂直居中就会想到, ...
- display:table的几个妙用：垂直居中、浮动……
一.为什么不用table系表格元素? 目前,在大多数开发环境中,已经基本不用table元素来做网页布局了,取而代之的是div+css,那么为什么不用table系表格元素呢? 1.用DIV+CSS编写出 ...
- display:table布局总结
1. table布局方式 2. table布局实际应用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...
- display:table / display:table-cell 用法
display:table 元素会作为块级表格来显示(类似table):表格前后带有换行符: display:table-cell 元素会作为表格单元格来显示(类似<td> 和 < ...
随机推荐
- 用 Python 为接口测试自动生成用例
用Python为接口自动生成测试用例 基于属性的测试会产生大量的.随机的参数,特别适合为单元测试和接口测试生成测试用例 尽管早在2006年haskell语言就有了QuickCheck来进行" ...
- 交互式 .Net
名词解析 1. 交互式 交互式是指输入代码后可直接运行该代码,然后持续输入运行代码. 2. 交互式 .Net .Net 是一种编译型语言,不像 python 这类的脚本型语言,可以边输入代码边运行结果 ...
- 新作！分布式系统韧性架构压舱石OpenChaos
摘要:本文首先以现今分布式系统的复杂性和稳定性的需求引出混沌工程概念,并阐述了OpenChaos在传统混沌工程上的优化与创新. 背景 随着Serverless,微服务(含服务网格)与越来越多的容器化架 ...
- Idea之常用插件
效率提升 Jrebel 热部署插件,修改代码编译就生效,节省大量重启服务时间.热部署支持修改方法代码,方法定义,类定义,接口定义(包括swagger文档),修改资源文件,修改mapper.xml(需配 ...
- 题解0012：剪花布条（KMP）
信奥一本通1465 KPM例题 题目链接:http://ybt.ssoier.cn:8088/problem_show.php?pid=1465 题目描述:给出花布条和小饰条(字符串),求花布条中能剪 ...
- java 5种IO模型
每日一句 人的痛苦会把自己折磨到多深呢? 每日一句 You cannot swim for new horizons until you have courage to lose sight of t ...
- SPPNet(特征金字塔池化)学习笔记
SPPNet paper:Spatial pyramid pooling in deep convolutional networks for visual recognition code 首先介绍 ...
- 盘点微信小程序跨页面传值的若干方式
直接给大家上干货 1.跳转页面传递参数 pageA.wxml <button type="primary" bindtap="jumpTo">点击跳 ...
- midway的使用教程
一.写在前面 先说下本文的背景,这是一道笔者遇到的Node后端面试题,遂记录下,通过本文的阅读,你将对楼下知识点有所了解: midway项目的创建与使用 typescript在Node项目中的应用 如 ...
- 【C#/VB.NET】 将PDF转为SVG/Image, SVG/Image转PDF
SVG是一种图形文件格式,它的英文全称为Scalable Vector Graphics,意思为可缩放的矢量图形.它在放大或者改变尺寸的情况下其图形质量不会有所损失,且与 JPG 和 GIF 图像比起 ...