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. ionic android升级检查

    https://www.cnblogs.com/zxj159/p/4421578.html 坑: 放到cordova.file.DataDirectory下载异常? 只好cordova.file.ex ...

  2. git reflog

    http://www.softwhy.com/article-8573-1.html https://www.cnblogs.com/irocker/p/git-reflog.html https:/ ...

  3. [Java] zjdbcping:JDBC数据库连接测试工具

    作者: zyl910 一.缘由 当数据库服务器很多时,或者要与第三方公司做数据库表交换时,此时觉得若有一个简单快捷的数据库连接测试工具就好了. 因为若是采取直接把程序部署到tomcat等容器再测试的办 ...

  4. Linux 添加开机启动项的两种方法

      1.编辑文件 /etc/rc.localvim /etc/rc.local #!/bin/sh## This script will be executed *after* all the oth ...

  5. 【C++】C++中typedef、auto与decltype的作用

    typedef 类型别名(type alias)是一个名字,使用typedef不会真正地创建一种新的数据类型,它只是已经存在数据类型的一个新名称.语法: typedef type name; 其中ty ...

  6. hive Spark SQL分析窗口函数

    Spark1.4发布,支持了窗口分析函数(window functions).在离线平台中,90%以上的离线分析任务都是使用Hive实现,其中必然会使用很多窗口分析函数,如果SparkSQL支持窗口分 ...

  7. 【转载】Hadoop 2.7.3 和Hbase 1.2.4安装教程

    转载地址:http://blog.csdn.net/napoay/article/details/54136398 目录(?)[+]   一.机器环境 系统:MAC OS Hadoop:2.7.3 H ...

  8. (8) MySQL主从复制架构使用方法

    一. 单个数据库服务器的缺点 数据库服务器存在单点问题 数据库服务器资源无法满足增长的读写请求 高峰时数据库连接数经常超过上限 二. 如何解决单点问题 增加额外的数据库服务器,组建数据库集群 同一集群 ...

  9. IDEA community + Gradle + Gretty 调试 servlet 应用 + war包部署到tomcat

    参考:https://guides.gradle.org/building-java-web-applications 1.运行和调试 IDEA创建gradle项目,项目结构如下 各个文件: buil ...

  10. windows 上搭建gitblit

    https://www.cnblogs.com/ucos/p/3924720.htmlhttps://www.cnblogs.com/sumuncle/p/6362697.htmlhttp://www ...