盒子模型:可以看做是一个盒子,包括外边距、边框、内边距、实际内容。

  flex布局:弹性布局,灵活性好。
  当给元素设置display:flex时,它就是flex容器,它的所有子元素自动成为容器成员,称为flex项目,简称项目。
  容器所具有的属性:display、flex-direction、flex-wrap、flex-flow、justify-content、align-items、align-content
  项目所具有的属性:order、flex-grow、flex-shrink、flex-basis、flex、align-self

简要说明盒子模型和flex布局的更多相关文章

  1. 标准W3C盒子模型和IE盒子模型

    标准W3C盒子模型和IE盒子模型   CSS盒子模型:网页设计中CSS技术所使用的一种思维模型. CSS盒子模型组成:外边距(margin).边框(border).内边距(padding).内容(co ...

  2. CSS3弹性盒模型,Flex布局教程

    布局的传统解决方案,基于盒状模型,依赖 display属性 + position属性 + float属性.它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现. CSS3中引入flex的弹性盒模型 ...

  3. 标准W3C盒子模型和IE盒子模型CSS布局经典盒子模型(转)

    盒子模型是css中一个重要的概念,理解了盒子模型才能更好的排版.其实盒子模型有两种,分别是 ie 盒子模型和标准 w3c 盒子模型.他们对盒子模型的解释各不相同,先来看看我们熟知的标准盒子模型: 从上 ...

  4. 弹性盒模型,flex布局

    弹性盒模型   弹性盒子是css3的一种新布局模式,由容器(父元素)和项目(子元素)组成. 弹性盒子是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式. 引入弹性盒模型的 ...

  5. 关于移动端常用的盒模型与flex布局

    在移动端选择布局的方式中常用盒模型display:-webkit-box达到自适应,然而display:-webkit-flex也同样能达到效果,因自在己移动端用-webkit-box比felx方式熟 ...

  6. 关于css盒子模型和BFC的理解

    CSS盒子模型 包含元素内容(content).内边距(padding).边框(border).外边距(margin) 一般元素总宽度 = element的width+padding的左右边距+mar ...

  7. CSS盒子模型和IE浏览器

    CSS盒模型图解 下面是一幅关于应用了CSS的元素是如何显示它的尺寸的图示. 在本篇文章中,所有的浏览器在计算盒模型总宽度时处理margin属性的方式都是一致的,所以我们将更多的精力放在padding ...

  8. CSS中盒子模型和position(一)

    今天遇到几个css中的重要的知识点,记得这些都是以前看过的:margin.padding.border和position.可是用起来还是有很多的问题,以前自己看过去总是懒得记录,等到用起来了都不知道自 ...

  9. IE盒子模型和W3C盒子模型

    IE盒模型出现在ie5.5以下的版本当中,ie6以上就实行W3C盒模型. box-sizing有两个属性,border-box和content-box. border-box对应传统的盒子模型,即ie ...

随机推荐

  1. linux 开启oracle监听

    secureCRT连接到数据库所在的linux机器,切换到oracle用户模式下 [root@nstlbeta ~]# su - oracle 步骤阅读 2 然后用sqlplus登录到数据库,关闭数据 ...

  2. Spring bean注入

    1.构造方法注入 1.bean类 public class User { private String name; private Integer age; private Cat cat; publ ...

  3. Java8 新特性 Data Time API

    Java8新的日期类型 在Java8以前,Date日期API对我们非常的不友好,它无法表示日期,只能以毫秒的精试来表示时间,并且可以修改,他的线程还不是安全的.所以Java8中引入了全新的日期和时间A ...

  4. spring-retry 重试机制的使用

    场景:由于网络抖动原因,或者其他原因,需要对代码重新执行,这个就需要重试了. import org.springframework.context.annotation.Configuration; ...

  5. ElasticSearch6.3.2源码分析之节点连接实现

    ElasticSearch6.3.2源码分析之节点连接实现 这篇文章主要分析ES节点之间如何维持连接的.在开始之前,先扯一下ES源码阅读的一些心得:在使用ES过程中碰到某个问题,想要深入了解一下,可源 ...

  6. WPF XAML Trigger中使用动画后 动画对象冻结的处理办法

    在编写XAML时 在Trigger中使用动画,在动画之后,动画对象就会被冻结,无法被其他动画或者属性改变. 处理办法有: 1 使用附加属性来添加动画 public static readonly De ...

  7. 【LOJ#6485】LJJ 学二项式定理(单位根反演)

    [LOJ#6485]LJJ 学二项式定理(单位根反演) 题面 LOJ 题解 显然对于\(a0,a1,a2,a3\)分开算答案. 这里以\(a0\)为例 \[\begin{aligned} Ans&am ...

  8. Git更改文件名大小写,提交失败问题解决

    背景:某java文件大小写写错了,一直提交不上去 例如我只是将updatePrivacySettingsTest.java变更为UpdatePrivacySettingsTest.java,但是add ...

  9. Java匹马行天下之JavaSE核心技术——工具类

    Java匹马行天之JavaSE核心技术——工具类 一.Object类 java.lang.ObjectObject类是所有类直接或间接的父类 常用的方法: toString():以字符串形式返回对象的 ...

  10. 关于toLocaleString(), toString(), valueOf()方法的使用

    所有对象都是具有toLocalString(), toString(), valueOf()三种方法的,此篇博客主要是讲述其在Array引用类型上的使用. 基本使用 调用valueOf()返回的是数组 ...