在写网页的时候一般都先用Div把网页的框架搭好(用不同的背景颜色来区分不同的Div块),然后填充每一个Div,最后把每个Div的背景颜色去掉

    <html>

      <head>

        <title></title>

        <style type="text/css">

          .divIndex

          {
            width:1000px;height:800px;background-color:yellow;margin:0px auto;
          }
          .divLogo
            { width:1000px;height:100px;background-color:red;
          }
          .divContent
          {
            width:1000px;height:300px;background-color:Green;
          }
          .divPicture
          {
            height:300px;width:300px;background-color:Blue;float:left;
          }
          .divText
          {
            height:300px;width:700px;background-color:Purple;float:left;
          }

        </style>

      </head>

      <body>

        <div class="divIndex">

          <div class="divLogo">
            <img src="data:image/000.jpg" height="100px" alt="姊妹"/>
          </div>
          <div class="divContent">
            <div class="divPicture"></div>
            <div class="divText"></div>
          </div>

        </div>

      </body>

    </html>

CSS——标准盒子模型的更多相关文章

  1. CSS样式----盒子模型(图文详解)

    盒子模型 盒子中的区域 一个盒子中主要的属性就5个:width.height.padding.border.margin.如下: width:内容的宽度.CSS中 width 指的是内容的宽度,而不是 ...

  2. 深入理解CSS系列(一):理解CSS的盒子模型

    接触前端也有好几个年头了,但是,讲实话,对于CSS的理解真的是不敢恭维,相信很多同行也有类似的感受吧!这是为什么呢?因为我们都认为CSS太简单了,没有必要深入学习,果真如此?其实,只不过是自己图样图森 ...

  3. 这些HTML、CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML、CSS、盒子模型、内容布局)

    这些HTML.CSS知识点,面试和平时开发都需要 No1-No4   系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) ...

  4. #CSS的盒子模型、元素类型

    CSS的盒子模型.元素类型   本文首先介绍了CSS元素的统一内部结构模型,盒子模型:然后介绍了CSS元素基于不同分类标准定义的元素类型,包括基于不同内容设置方式定义的replaced元素和non-r ...

  5. 深入了解CSS中盒子模型

    CSS中盒子模型介绍 什么是盒子? 盒子是用来存储物品,我们可以将盒子理解为酒盒,酒盒有什么组成的呢? 有酒可以喝.有填充物保护酒防止酒被摔坏.纸盒子. 我们怎么理解CSS中的盒子呢,CSS中盒子有什 ...

  6. CSS3_标准盒子模型和怪异盒子模型

    #box{ width: 200px; height: 200px; background-color: pink; } 标准盒子模型 box-sizing: content-box; padding ...

  7. 使用css弹性盒子模型

    提示: 当期内容不充实, 修改后再来看吧 以下称:弹性子元素: 子元素, 弹性容器: 容器 弹性盒子的属性 1. css弹性盒子模型规定了弹性元素如何在弹性容器内展示 2. 弹性元素默认显示在弹性容器 ...

  8. CSS 弹性盒子模型

    CSS 弹性盒子模型 https://www.w3.org/TR/2016/CR-css-flexbox-1-20160526/ CSS Flexible Box Layout Module Leve ...

  9. CSS之盒子模型

    CSS核心内容 源文件目录: D:\Users\ylf\Workspaces\MyEclipse 10 标准流 盒子模型 浮动 定位 标准流/非标准流: 标准流:就是普通的 非标准流:实际工作中要打破 ...

随机推荐

  1. 穿透内网,连接动态ip,内网ip打洞-----p2p实现原理

    转:http://blog.csdn.net/suhuaiqiang_janlay/article/details/60466333 本人找几篇讲得好的来整理一下. (1)问题的由来: (2)动态ip ...

  2. 02: SocketServer服务

    网络编程其他篇 目录: 1.1 SocketServer四种基本流及 异步处理理论部分 1.2 创建socketserver实现: 多客户端并发 1.3 SocketServer实现多并发FTP 部分 ...

  3. 关于STM32外接4—16MHz晶振主频处理方法

    由于STM32F10x库官方采用的是默认的外接8MHz晶振,因此造成很多用户也采用了8MHz的晶振,但是,8MHz的晶振不是必须的,其他频点的晶振也是可行的,只需要在库中做相应的修改就行.    在论 ...

  4. Spark On YARN 分布式集群安装

    一.导读 最近开始学习大数据分析,说到大数据分析,就必须提到Hadoop与Spark.要研究大数据分析,就必须安装这两个软件,特此记录一下安装过程.Hadoop使用V2版本,Hadoop有单机.伪分布 ...

  5. Python3基础 list 查看filter()返回的对象

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  6. Intellij新建Spring项目引入用户目录下的Spring jar包

    首先,在IntelliJ IDEA中新建module,选择Spring应用:   在初次使用时,如果IDE检测到本地没有spring核心库,则会在新建过程中下载对应库文件,在使用spring框架时,可 ...

  7. FAST UA API

    参考: FAST_UA 编程手册 FAST DATA STRUCTURE fast_packet fast_metadata fast_rule fast_flow FAST UA API 1.fas ...

  8. 51nod 1102 面积最大的矩形(单调栈)

    http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1102 题意: 思路: 做法就是求出每个长方形向左向右所能延伸的最大距离. ...

  9. wireshark 下载

    https://www.wireshark.org/download/win64/

  10. ubuntu server 多网卡

    https://wenku.baidu.com/view/51fb15742f60ddccdb38a007.html