酷狗小试页面和简写代码

酷狗页面浮动

做一个页面首先要做布局，布局订好，剩下的内容填充时不会太乱！
前几天老师讲的一个页面布局用浮动来展示，

酷狗官网部分页面如图

鼠标上去时有阴影遮盖，下方的播放键也有一些hover效果。
截图无法展现，稍后将自己做的页面展示一下。

首先做布局。

我首先一个大div框住5个小div，后四个大小一下，命名相同，(注意：命名相同之后只需要给相同的css样式就可以，这就是代码简写，我之前做的一个项目，24个相同的东西，我写了24个不同命名和几乎相同的样式，很浪费，所有代码要简写。省时省力！)

后四个css代码

.mu{
	width: 160px;				//宽高
	height: 160px;
	background-color: red;      //背景色
	float: left;
	margin-left: 7px;					//左边距
	margin-bottom: 6px;			//下边距
	position: relative;
}

布局做出来后看酷狗官网就知道样式差不多
所以 主写第一个

<div class="left">
				<img src=&