html，css的细节知识

1，网站logo部分使用<h1>+<a>标签模式有利于SEO搜索以及可以通过a路径跳转网站的其他页面。

<div>
    <h1>
        <a href=”#”>logo关键字</a>
    </h1>
</div>

h1 a {
display: inline-block;
width: 100px;
height: 100px;
background: url(../images/logo.png);
text-indent: -9999em;
}

2，定位：子绝父相（子元素绝对定位，父元素相对定位）：解决图片或文字嵌套问题

3，把行内元素改为（display: inline-block）行内块元素，再设置text-align:center，其中的内容才能居中显示。

4，一般标准屏幕尺寸1366*768,版心尺寸用900px,1000px,1100px,1200px。

5，使用background-color: rgba(255,255,255,.6);可设置透明度（C3新特性，在RGB的基础上加进了一个通道Alpha）

6，清除浮动4种的方法

①　额外标签法；

<div style=”clear:both”></div>

②　在父级添加  overflow:  hidden  /auto  /scroll  属性方法；

③　使用  :after 伪元素清除浮动；

.clearfix:after {

    content: ".";
    height: 0;
    display: block;
    visibility: hidden;
    clear: both;
}

.clearfix {
    *zoom: 1;
}

④　使用 :before 和 :after 双伪元素清除浮动。

.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
    /* 触发BFC清除浮动 防止外边距合并*/
}

.clearfix:after {
    clear: both;
}

.clearfix:after {
    *zoom: 1;
}