display:table用处:

1、创建登高列

2、实现大小不确定元素的垂直居中

3、容器内子项目数目未知,子项目平均分配容器的水平空间

float必须指定其宽度才行,不确定的话就用display:table-cell

box-sizing的属性值:content-box(default),border-box,padding-box。

1、content-box,border和padding不计算入width内

2、padding-box,padding计算入width内

3、border-box,border和padding计算入width之内,(其实就是怪异模式);

css3中display和box小结的更多相关文章

  1. 浅谈CSS3中display属性的Flex布局

    浅谈CSS3中display属性的Flex布局   最近在学习微信小程序,在设计首页布局的时候,新认识了一种布局方式display:flex 1 .container { 2 display: fle ...

  2. 区别CSS中display:box;inline;none以及HTML中 <frame> 标签<table> 标签的 frame 属性

    区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...

  3. 【分享】谈CSS3中display属性的flex布局

    最近在学习微信小程序(重新学习微信小程序),在设计首页布局的时候,新认识了一种布局方式display:flex .guide-top{ height: 36%; display: flex; /*fl ...

  4. 谈谈CSS3中display属性的Flex布局(弹性布局)

    最近为了微信小程序,回忆起之前有接触过的弹性布局(display:Flex) 网上摘录的原文地址:https://www.cnblogs.com/xuyuntao/articles/6391728.h ...

  5. CSS3中DIV水平垂直居中-2(3)

    用到CSS3中display的新属性. HTML <div class="parent"> </div> CSS html,body{ width: 100 ...

  6. CSS3中flexbox如何实现水平垂直居中和三列等高布局

    最近这些天都在弥补css以及css3的基础知识,在打开网页的时候,发现了火狐默认首页上有这样一个东西.

  7. CSS3中的弹性流体盒模型技术详解

    先回顾一下CSS1 和 CSS2中都已经定义了哪些布局方面的属性,这样也会增加我们理解弹性布局.   其实我们现在有很多一部分人,你们刚刚接触CSS层叠样式表,或者接触有一段时间了,但是却没有很好的去 ...

  8. 关于CSS3中transform变换的小坑

    2017年6月30日15:05:46 今天在写一个demo的时候,发现CSS3中transform变换的一个特性. 首先,我先描述一下我发现的情况(问题再现): <div class=" ...

  9. css3中的布局相关样式

    web页面中的布局是指在页面中如何对标题.导航栏.主要内容.脚注.表单等各种构成要素进行合理编辑.在css3之前,主要使用float属性或position属性进行页面中的简单布局,但是也存在一些缺点, ...

随机推荐

  1. JGroups 入门实践(转)

    前言 JGroups是一个开源的纯java编写的可靠的群组通讯工具.其工作模式基于IP多播,但可以在可靠性和群组成员管理上进行扩展.其结构上设计灵活,提供了一种灵活兼容多种协议的协议栈. JGroup ...

  2. android 实现悬架控制

    实现桌面View          如桌面歌词  1)将要显示在桌面的view,通过WindowManager.addView.挂在到WindowManager下;注意,WindowManager对象 ...

  3. Debian/Ubuntu 已安装gcc/g++ 4.8.1

    gcc 4.8.1 是第一个全然支持C++11(C++14非常可能在gcc 4.9.0開始支持.)的编译器,Windows上能够安装mingw版的.在sourceforge 上有下载.安装也比較方便. ...

  4. HDU 2203 亲串(kmp)

    Problem Description 随着人们年龄的增长更大,更聪明还是越大越愚蠢,这是一个值,相同的问题Eddy也一直在思考,由于他在非常小的时候就知道亲和串怎样推断了,可是发现,如今长大了却不知 ...

  5. 备忘录模式设计模式入门Memento

    //备忘录模式定义: //在不破坏封装性的前提下,捕获一个对象的内部状态,并在该对象之外保存这个状态. //这样以后就能够将该对象恢复到原先保存的状态 //实例:測试两种方案.两种方案在第一阶段的过程 ...

  6. SQLServer 2012异常问题(二)--由安装介质引发性能问题

    原文:SQLServer 2012异常问题(二)--由安装介质引发性能问题 问题描述:生产环境一个数据库从SQLSERVER 2008 R2升级到SQLSERVER 2012 ,同时更换硬件,但迁移后 ...

  7. NSIS常用代码整理

    原文 NSIS常用代码整理 这是一些常用的NSIS代码,少轻狂特意整理出来,方便大家随时查看使用.不定期更新哦~~~ 1 ;获取操作系统盘符 2 ReadEnvStr $R0 SYSTEMDRIVE ...

  8. 【cocos2d-js公文】十八、Cocos2d-JS v3.0物业风格API

    1. 新的API风格 我们直接来看看你能够怎样使用Cocos2d-JS v3.0: 曾经的API 新的API node.setPosition(x, y); node.x = x; node.y = ...

  9. MVC中使用SignalR

    MVC中使用SignalR打造酷炫实用的即时通讯功能附源码   前言,现在这世道写篇帖子没个前言真不好意思发出来.本贴的主要内容来自于本人在之前项目中所开发的一个小功能,用于OA中的即时通讯.由于当时 ...

  10. Python输出文件由线解释和扩展的具体内容

    结束此处的测试代码中作者写的,第一段包含不正确的版本号,后者是正确的版本号: #! /usr/bin/python2.7 try:     filename = raw_input('please i ...