关于网页布局多种实现方式的选择性

其实在前端的布局过程中经常会碰到同一个样式可以有很多种实现方法的。

在初期的时候也非常纠结于跟着视频教程里面的来写，后来发现也不一定。

但是在写了几个小的静态网页，经过自己总结之后得到以下几个小tip：

1、尽量简洁网页成分构造

      例如有时候只需要一张图片，但是要对图片进行定位的时候很多人会选择在div当中添加dmg，代码如下：

    <div class="index">
		<img src="images/index.png" alt="">
    </div>

      但是我会选择只使用一个div在css中选择通过url（）函数来达到我想要的效果，代码如下：

      Html：

<div class="img"></div>

      Css:

.img{
	background: url(../images/index.png) no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	background-size: cover;
}

      这样带来的直接好处是类名或者标签名深度变浅，数量减少，减小html构造的复杂程度，不容易写到后面越来越混乱。另外一个好处是通过这样的方式写html可以不用js的