CSS是层叠样式表。下面，我们来看看怎么使用CSS让图片水平垂直都居中吧。
01新建一张文档
在桌面新建一张文本文档，改名为1.txt，如下图所示：
02基础代码
然后打开文本文档，编写基础代码，再把桌面上的老虎图片引入进去，如下图所示：
03后缀名
然后把文本文档后缀名改为.html，如下图所示：
04运行网页
然后在浏览器中运行网页，现在图片有了，只是还没有居中，图片居住代码要用CSS写，如下图所示：
05CSS代码
然后写上CSS代码，如下图所示：
06垂直水平居中
可以看到图片已经垂直和水平居中，如下图所示：
07总代码
<!DOCTYPE html>
<head>
<title>html</title>
<style type="text/css">
.picTiger{
margin: auto
position: absolute
top: 0
left: 0
bottom: 0
right: 0
}
</style>
</head>
<body>
<img class="picTiger" src="C:/Users/Administrator/Desktop/1.png">
</body>
<html>
点击事件只能设置在html元素中，所以background是没有办法设置点击的。但是，它的元素div是有点击事件onclick的。如果div设置onclick无效，建议使用jquery来绑定div的click事件。此外，由于div中还有其它元素有click事件，所以，这就涉及到了事件冒泡的问题。
那么，说到这，指出你的一个代码问题。网页中，html元素的id必须是唯一的。如果id不唯一，一代涉及id，程序可能会出错。而class才是可以重复的。
可以如下纠正：
<input type="submit" name="button" id="btn_searc" value=" " class="button">
<input type="button" name="button" id="btn_ask" value=" " class="button" >
下面就是解决事件冒泡问题了，还是建议jquery来解决
对于div的内层元素，我们使用jquery来绑定它的单击事件，并且静止响应div的单击事件
$('#btn_searc').blind('click',function(event){
searchPost() //这里响应id为btn_searc元素的单击事件
event.stopPropagation() //这局话就是停止事件冒泡了，也就是说，接下来的div的单击事件将不再会被响应。
})
同理，另外一个原色的单击事件可以如下
$('#btn_ask').blind('click',function(event){
ask()
event.stopPropagation()
})
那么，接下来就是去绑定div的单击事件，首先，还是将div的class改成id，并保证其唯一性。同时，css也要改成id的选择器：
#communion_header{
height: 88px
width: 690px
margin: 0 auto
background: url(../../images/communicate/communtion_logo.png) no-repeat 50px 30px
padding: 40px 0 0 270px
}
jquery绑定click
$('#communion_header').click(function(){
//这里写div的单击代码。可以使用JavaScript，更可以使用其进阶语言jQuery
})
最后，需要说明的是，代码使用的是JavaScript语言的一种进阶语言jQuery。它的使用要借助于jQuery库的存在。所以你必须去下载个jquery.js，并且在网页中添加关联。
