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> 和 < ...
随机推荐
- Vulnhub-DC-4靶机实战
前言 靶机下载地址:https://www.vulnhub.com/entry/dc-4,313/ KALI地址:192.168.75.108 靶机地址:192.168.75.207 一.信息发现 1 ...
- C#/VB.NET 实现Word和ODT文档相互转换
ODT文档格式一种开放文档格式(OpenDocument Text).通常,ODT格式的文件可以使用LibreOffice Writer.MS Word或其他一些文档编辑器来打开.我们在处理文档时,可 ...
- 2022年5月11日，NBMiner发布了41.3版本，在内核中加入了100％LHR解锁器，从此NVIDIA的显卡再无锁卡一说
2022年5月11日,NBMiner发布NBMiner_41.3版本,主要提升了稳定性. 2022年5月8日,NBMiner发布NBMiner_41.0版本,在最新的内核 ...
- spring boot 默认日志替换为 log4j
移除默认日志 <dependency> <groupId>org.springframework.boot</groupId> <artifactId> ...
- 【多线程】线程礼让 Thread.yield()
线程礼让 Thread.yield() 礼让线程,让当前正在执行的线程暂停,但不阻塞 : 将线程从运行状态转为就绪状态 : 让cpu重新调度,礼让不一定成功!看CPU心情. 代码示例: /** * @ ...
- 485. Max Consecutive Ones - LeetCode
Question 485. Max Consecutive Ones Solution 题目大意:给一个数组,取连续1的最大长度 思路:遍历数组,连续1就加1,取最大 Java实现: public i ...
- 好客租房56-props深入（3props校验-约束规则）
1常见类型:Array,bool,func,number,object,string 2React:element 3必填项:isRequred 4特定结构的想:shape({}) //导入react ...
- Pandas复杂查询、数据类型转换、数据排序
Pandas高级操作 1.复杂查询 (1)逻辑运算 以DataFrame其中一列进行逻辑计算,会产生一个对应的bool值组成的Series 于是我们可以利用返回的bool列表进行一系列的数据查询 (2 ...
- 「Java分享客栈」Nacos配置中心称王称霸，我Apollo一生也不弱于人！
前言 Apollo又称阿波罗配置中心,在前两年还是挺火的,但阿里SpringCloud套件席卷国内之后,nacos就成为了最被亲睐的分布式配置中心,nacos是配置中心和注册中心二合一的产品,单纯功能 ...
- DataX异构数据源离线同步工具json文件配置说明
DataX 是阿里开源的一个异构数据源离线同步工具,致力于实现包括关系型数据库(MySQL.Oracle等).HDFS.Hive.ODPS.HBase.FTP等各种异构数据源之间稳定高效的数据同步功能 ...