zoukankan      html  css  js  c++  java
  • css 初始包含块

    continuous media ,paged media

    关于continuous media[连续媒体]和paged media[分页媒体]
    直白的讲,continuous和paged media是两种媒体组,什么意思呢?对于我们每天接触到得信息种类,早有人替我们进行归类了,例如:投影机代表的媒体类型就是投影,归入分页媒体组,而平常使用的电脑屏幕 ,是归于连续媒体组。
    

    初始化包含块

    1. 根元素的包含块是一个矩形,叫做初始化包含块
    2. 对于 【连续媒体】就是,初始化包含块的 尺寸等于viewport的尺寸,起点是canvas的原点
    3. 初始化包含块的方向(direction)等同于根元素的方向
    4. 初始化包含块不是viewport,只是尺寸一样

    在没有定位的情况下, 下面文档的包含块情况如下:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
    <HTML>
       <HEAD>
          <TITLE>Illustration of containing blocks</TITLE>
       </HEAD>
       <BODY id="body">
          <DIV id="div1">
          <P id="p1">This is text in the first paragraph...</P>
          <P id="p2">This is text <EM id="em1"> in the 
          <STRONG id="strong1">second</STRONG> paragraph.</EM></P>
          </DIV>
       </BODY>
    </HTML>
    html	initial C.B. (UA-dependent)
    body	html
    div1	body
    p1	div1
    p2	div1
    em1	p2
    strong1	p2
    

     

    假如DIv1 定位:

       #div1 { position: absolute; left: 50px; top: 50px }
    

    他的包含块不在是body;将会变成初始化包含块

    假如给em1 定位:

       #div1 { position: absolute; left: 50px; top: 50px }
       #em1  { position: absolute; left: 100px; top: 100px }

    包含块对应如下:

    html	initial C.B. (UA-dependent)
    body	html
    div1	initial C.B.
    p1	div1
    p2	div1
    em1	div1
    strong1	em1
    

      


  • 相关阅读:
    用js实现 全选功能(Gridview)
    图片 加文字水印或者图片水印
    Gridview中RowCommand事件的应用
    图片噪点的产生
    DataList实现折叠效果
    利用Request对象的CurrentExecutionFilePath做分页
    利用分页控件AspNetPager来做数据的分页
    log4Net一些记忆性总结
    彩色验证码
    组织机构设计器窗体基类 代码分析
  • 原文地址:https://www.cnblogs.com/btgyoyo/p/7704271.html
Copyright © 2011-2022 走看看