从代码可以看出logo的大小是250px * 83px，你先弄一张这个规格的logo图片，格式是png的，文件名是1364876078，即1364876078.png。然后上传到，"网站跟目录/Templates/green/images/"目录下，替换掉原来的logo文件就行了，无需这么麻烦的去改CSS，况且这跟CSS也没有半点关系。
首先，你写的四个<div>中 你又没有给哪个div指定样式，直接写一个div的公共样式。那么默认情况下，通过浏览器打开的时候是空白的，只看到3个粉红色的div1, div2, div3.1. div的样式会从优先级开始显示内容，而内联的的样式优先级是最高的，所以一打开浏览器就会显示div4的内容。
2. 你给4个div都命名了，却都没有分别定义样式。而写了个
div{
width: 200px
height: 200px
background-color: pink
display: none
text-align: center
font: 50px/200px "微软雅黑"
position: absolute
}
默认情况下，这几个div找不到自己的css样式就会通用你写的这个样式。如果你不在4里面写内联样式，所以会就会倒致空白，写了内联样式就会优先显示。
3. 如果没有定义 <div id="4"style="width:400pxheight: 300pxdisplay: inline-blockbackground:red">div4 </div>， 那么当打开浏览器时div3是在最前面显示的，因为div3你没有定义样式，那么它是用公共样式，而公共样式中你设置了display: none那么也就是像我上面刚才所说的一片空白，只看到div1, div2,div3 三个粉红色的字，下面的框框块级元素没显出来，必需点了过后才显示出来。
4. 如果去掉公共样式中的display: none就是div3一直显示在前面，盖住后面的div2,div1,div4.你再怎么点都是看不到的。
5. 如果你还不明白怎么回事，就把样式：
#4{
width: 200px
height: 200px
display: inline-block
}
中的#4，分别改成#div1, # div2, #div3.改一个用浏览器看一下，你就会悟出其中的原理了。
.box {/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell
vertical-align:middle
/*设置水平居中*/
text-align:center
/* 针对IE的Hack */
*display: block
*font-size: 175px/*约为高度的0.873，200*0.873 约为175*/
*font-family:Arial/*防止非utf-8引起的hack失效问题，如gbk编码*/
width:200px
height:200px
border: 1px solid #eee
}
.box img {
/*设置图片垂直居中*/
vertical-align:middle
}
你看看这个方法可以不？
