1、布局（盒子布局、盒子模型、标准流、脱离文档流）

标准文档流：块级独占一行  ，行内块和行内元素都是和其他共占一行，在盒子中的元素遵循标准流从左到右从上到下排列，超过父元素时会溢出。

一行行看

浮动+标准流配合使用

版心：width+margin：0 auto；

ul>li 、标题、段落、a、img、dl>dt+dd

定位：相对定位、子绝父相、固定定位、z-index

元素宽度：  块级---不设置时是父元素100%；行内块元素宽度默认是内容宽度；行内元素没有宽高属性，除非转换显示模式。

溢出、滚动条

。。。

css学习_div+css布局的更多相关文章

  1. Html和Css学习笔记-css进阶-盒模型

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...

  2. CSS 学习笔记 - Flex 布局

    传统布局方式的局限性 传统的网页布局方式,采用 display + position + float 的方式来实现.这种方式,无法实现一些复杂的布局,并且在实现某些布局时,会有一些局限性. 比如,最常 ...

  3. css学习_css3伸缩布局 flex布局

    1.flex布局 案例一: 案例二:   保证不至于缩放得太小或太大 案例三:flex的值不一定要写成几份,可以写成固定值 案例四: 竖着3等分(父容器按照高度3等分) !!案例  -----用fle ...

  4. CSS学习笔记——CSS选择器样式总结

    <style type="text/css"> * { padding:0; margin:0; } .box h2 { //内边距左边的距离 padding-left ...

  5. CSS学习笔记——CSS中定位的浮动float

    昨天在解决了盒模型的问题之后又出现了新的知识模糊点:浮动和绝对定位?今天先解决浮动相关的问题,首先列举出想要解决的问题: 1.浮动到底是怎么样的? 2.浮动对元素的影响有什么? 3.浮动主要用来干什么 ...

  6. Html和Css学习笔记-css基础知识

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...

  7. CSS 学习笔记——CSS Selector

    CSS1 中定义的选择器 类型选择器 用于选择指定类型的元素(其实他就是 html 标签选择器),常见用法如下: body { /*对 body 元素定义样式*/ } body,div { /*同时选 ...

  8. amazeui学习笔记--css（布局相关1）--网格Grid

    amazeui学习笔记--css(布局相关1)--网格Grid 一.总结 基本使用 1.div+class布局:amaze里面采取的就是div+class的布局方式  <div class=&q ...

  9. amazeui学习笔记--css（布局相关3）--辅助类Utility

    amazeui学习笔记--css(布局相关3)--辅助类Utility 一.总结 1.元素清除浮动: 添加 am-cf 这个 class 即可 2.水平滚动: .am-scrollable-horiz ...

随机推荐

  1. vim配置go语法高亮

    操作系统 : CentOS7.3.1611_x64 go 版本 : go1.8.3 linux/amd64 vim版本 :version 7.4.160 vim配置go语言语法高亮的问题已经遇到过好几 ...

  2. Android研发中对String的思考（源代码分析）

    1.经常使用创建方式思考: String text = "this is a test text "; 上面这一句话实际上是运行了三件事  1.声明变量 String text; ...

  3. [转]Anatomy of a Program in Memory

    Memory management is the heart of operating systems; it is crucial for both programming and system a ...

  4. Python中的高级数据结构详解

    这篇文章主要介绍了Python中的高级数据结构详解,本文讲解了Collection.Array.Heapq.Bisect.Weakref.Copy以及Pprint这些数据结构的用法,需要的朋友可以参考 ...

  5. Nginx 学习专栏

    Nginx 入门学习教程 译:Centos7 编译安装Nginx 教程

  6. Atitit 项目版本管理gitflow 与 Forking的对比与使用

    Atitit 项目版本管理gitflow 与 Forking的对比与使用 1.1. 版本管理的历史 csv>>svn >git 1 1.2. gitflow的核心是分版本管理,for ...

  7. 【转载】最强NLP预训练模型！谷歌BERT横扫11项NLP任务记录

    本文介绍了一种新的语言表征模型 BERT--来自 Transformer 的双向编码器表征.与最近的语言表征模型不同,BERT 旨在基于所有层的左.右语境来预训练深度双向表征.BERT 是首个在大批句 ...

  8. hdfs 安全模式介绍

    1. hdfs在启动的时候现将映像载入内存,并执行edits中的各项操作,一旦在内存中建立元数据的映像,则闯进啊一个新的fsimage文件和空的编辑日志.此时namenode开始监听datanode请 ...

  9. Vue：$set和$delete

    一.$set 在开始讲解$set之前先看下面的一段代码,实现的功能:当点击“添加”按钮时,动态的给data里面的对象添加属性和值,代码示例如下: <!DOCTYPE html> <h ...

  10. 配置gradle的daemon

    文档里提到,配置Daemon,能够加速gradle的构建,为了获取这个性能提上,我也得开启这个Daemon. 在Windows环境下:,可以执行这个命令 (if not exist "%US ...