css学习_div+css布局

时间：2023-02-14 09:22:24

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. Linux有问必答：如何在Linux中修改环境变量PATH

    提问: 当我试着运行一个程序时,它提示“command not found”. 但这个程序就在/usr/local/bin下.我该如何添加/usr/local/bin到我的PATH变量下,这样我就可以 ...

  2. 现在有T1、T2、T3三个线程，怎样保证T2在T1执行完后执行，T3在T2执行完后执行？使用Join

    public class TestJoin { public static void main(String[] args) { Thread t1 = new Thread(new T1(), &q ...

  3. BZOJ2457 BeiJing2011 双端队列

    [问题描述] Sherry现在碰到了一个棘手的问题,有N个整数需要排序.  Sherry手头能用的工具就是若干个双端队列.        她需要依次处理这N个数,对于每个数,Sherry能做以下两件事 ...

  4. pku3670 Eating Together

    http://poj.org/problem?id=3670 DP,最长不降子序列,O(n*logn)解法 #include <stdio.h> #define N 30030 int n ...

  5. CoreGraphics 之CGAffineTransform仿射变换&lpar;3&rpar;

    CoreGraphics 之CGAffineTransform仿射变换(3)   CoreGraphics 的 仿射变换 可以用于 平移.旋转.缩放变换路径 或者图形上下文. (1)平移变换将路径或图 ...

  6. JQ怎么跳出 each循环

    return false;——跳出所有循环:相当于 javascript 中的 break 效果. return true;——跳出当前循环,进入下一个循环:相当于 javascript 中的 con ...

  7. 那些令人惊艳的TensorFlow扩展包和社区贡献模型

    随着TensorFlow发布的,还有一个models库(仓库地址:https://github.com/tensorflow/models),里面包含官方及社群所发布的一些基于TensorFlow实现 ...

  8. Docker Kubernetes 命令行创建容器

    Docker Kubernetes 命令行创建容器 环境: 系统:Centos 7.4 x64 Docker版本:18.09.0 Kubernetes版本:v1.8 管理节点:192.168.1.79 ...

  9. Python 学习 第九篇：模块

    模块是把程序代码和数据封装的Python文件,也就是说,每一个以扩展名py结尾的Python源代码文件都是一个模块.每一个模块文件就是一个独立的命名空间,用于封装顶层变量名:在一个模块文件的顶层定义的 ...

  10. MATLAB中 histogram 和 imhist 的区别

    matlab有两个生成直方图的库函数,分别是imhist和histogram,二者有何区别呢? 区别就是: imhist 官方help:imhist(I) calculates the histogr ...

相关文章