网页讲解01

网页讲解01

第一章：div + css

1.
    <!> <html xmlns="http://www.w3.org/1999/xhtml">

   什么是网页声明：告知浏览器我采用什么规范写网页 xmlns htmls html

2.网页的定位

   相对定位：relative 自己原来的位置，原来的位置不消失浮动居中连用

   绝对定位：absolute 相对于距离自己最近的有position属性的祖宗节点（如果不存在这样的祖宗节点，相对于可视区域（静态））

   固定定位：fixed 浏览器（动态）可视区域，就是可以看到的区域，滚动条，广告，不动的地方等，原来的位置消失不能和浮动联用


   定位里面属性 left right bottom top 可正，可负百分比
              z-index

   对于普通的盒子（div）用：   margin: 0px auto;就可以居中了 margin-left 属性设置元素的左外边距

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>布局01</title>
    <style type="text/css">
        .chb{
                600px;
                height: 300px;
                position: fixed; //定位
                left: 50%;
                top:10px;
                margin-left: -300px; //设置元素的左外边距
                background-color: yellow;
             }
        .chb1{ 1000px;
                height: 2000px;
                background-color: black;
                margin: 0px auto;
        }
    </style>
</head>
<body>
    <div class="chb1"></div>
    <div class="chb"></div>

</body>
</html>

荣耀存于心，而非留于形我还在寻找，回家的路长路漫漫，唯剑做伴且随疾风前行，身后一许流星吾虽浪迹天涯，却未迷失本心