<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <link rel="stylesheet" href="07-31-2.css"> <script type="text/javascript" src="360截图20190329165056118.jpg"></script> </head> <body> <!-- 两种隐藏方式； dispaly;none; 不占位置 隐藏 visibility;hidden: 占位置 隐藏 三种标签模式： display 块标签 biock : 默认占一行 默认宽高为0 可以设置宽度和高度 行内块标签 inline-block；不占一行 可以设置宽度和高度 行内标签 inline; 不占一行 不可以设置宽度和高度 宽度根据内容来 <span></span> 层级； z-index;属值越大层级越高 定位；position 连用，z-index top left right bottom fixed 绝对定位: relative 相对定位 自身位置不消失 absolute;绝对 定位相当于最近的又positionyangshi 浮动；float 浮动块元素 浮动块元素如果超出设定的区域范围会自动换行 --> <!-- <div id="demo1"> <div class="demo2"> 顶部文本 </div> <div class="demo3"> <butto>普通按钮</butto> </div> <span class="demo4"> 三种标签模式 </span> <span class="demo4"> 三种标签模式 </span> </div> --> <!-- 这是内容--> <div id="demo0"> <!-- 这是左边内容--> <div id="demo01" class="demo"></div> <!-- 这是右边内容--> <div id="demo02" class="demo" colou="red"> <div id="in-1" ></div> <div id="in-2"></div> </div> </div> </body> </html>