当前位置: 代码迷 >> HTML/CSS >> 哪位大侠给解决一个细节有关问题―两个层之间出现了空白
  详细解决方案

哪位大侠给解决一个细节有关问题―两个层之间出现了空白

热度:122   发布时间:2012-10-25 10:58:58.0
哪位大侠给解决一个细节问题―两个层之间出现了空白
从网上下了一个右侧悬浮客服代码,发现独自浏览的话一点问题都没有,但是加到我的网页中之后就出现了一下的一个空白,哪位大侠告诉我是咋回事啊?比较急~~~~~



HTML:
HTML code

<DIV id=floatTools class=float0831>
  <DIV class=floatL><A style="DISPLAY: none" id=aFloatTools_Show class=btnOpen 
title=查看在线客服 
onclick="javascript:$('#divFloatToolsView').animate({width: 'show', opacity: 'show'}, 'normal',function(){ $('#divFloatToolsView').show();kf_setCookie('RightFloatShown', 0, '', '/', 'www.istudy.com.cn'); });$('#aFloatTools_Show').attr('style','display:none');$('#aFloatTools_Hide').attr('style','display:block');" 
href="javascript:void(0);">展开</A> <A id=aFloatTools_Hide class=btnCtn 
title=关闭在线客服 
onclick="javascript:$('#divFloatToolsView').animate({width: 'hide', opacity: 'hide'}, 'normal',function(){ $('#divFloatToolsView').hide();kf_setCookie('RightFloatShown', 1, '', '/', 'www.istudy.com.cn'); });$('#aFloatTools_Show').attr('style','display:block');$('#aFloatTools_Hide').attr('style','display:none');" 
href="javascript:void(0);">收缩</A> </DIV>
  <DIV id=divFloatToolsView class=floatR>
    <DIV class=tp></DIV><DIV class=cn>
      <UL>
        <LI class=top>
          <H3 class=titZx>QQ咨询</H3>
        </LI>
        <LI><SPAN class=icoZx>在线咨询</SPAN> </LI>
        <LI><A class=icoTc href="#">客服一</A> </LI>
        <LI><A class=icoTc href="javascript:void(0);">客服二</A> </LI>
        <LI><A class=icoTc href="#">客服三</A> </LI>
        <LI class=bot><A class=icoTc href="javascript:void(0);">客服四</A> </LI>
      </UL>
      <UL class=webZx>
        <LI class=webZx-in><A href="#" target="_blank" style="FLOAT: left"><IMG src="images/right_float_web.png" border="0px"></A> </LI>
      </UL>
      <UL>
        <LI>
          <H3 class=titDh>电话咨询</H3>
        </LI>
        <LI><SPAN class=icoTl>400-000-0000</SPAN> </LI>
        <LI class=bot>
          <H3 class=titDc><A href="#" target="_blank">在线留言</A></H3>
        </LI>
      </UL>
    </DIV>
  </DIV>
</DIV>



CSS代码:
CSS code

.float0831 {
    POSITION: fixed; TOP: 150px;RIGHT: 1px; _position: absolute;
}
.float0831 A {
    COLOR: #00a0e9
}
.float0831 A:hover {
    COLOR: #ff8100; TEXT-DECORATION: none
}
.float0831 .floatL {
    POSITION: relative; WIDTH: 28px; FLOAT: left
}
.float0831 .floatL A {
    TEXT-INDENT: -9999px; DISPLAY: block; FONT-SIZE: 0px
}
.float0831 .floatR {
    BACKGROUND: url(../images/float_bg.gif)
}
.float0831 .tp {
    BACKGROUND: url(../images/float_bg.gif)
}
.float0831 .cn {
    BACKGROUND: url(../images/float_bg.gif)
}
.float0831 .floatR {
    PADDING-BOTTOM: 15px; WIDTH: 130px; BACKGROUND-REPEAT: no-repeat; BACKGROUND-POSITION: -131px bottom; FLOAT: left; OVERFLOW: hidden
}
.float0831 .tp {
    BACKGROUND-REPEAT: no-repeat; BACKGROUND-POSITION:0 0; HEIGHT: 10px;
}
.float0831 .cn {
    BACKGROUND-REPEAT: repeat-y; BACKGROUND-POSITION: -262px 0px
}
.float0831 .cn H3 {
    TEXT-INDENT: -9999px; HEIGHT: 36px; FONT-SIZE: 0px
}
.float0831 .cn UL {
    PADDING-BOTTOM: 0px; PADDING-LEFT: 14px; PADDING-RIGHT: 14px; PADDING-TOP: 0px
}
.float0831 .cn UL LI {
    BORDER-BOTTOM: #e6e5e4 1px solid; LINE-HEIGHT: 36px; WORD-WRAP: break-word; HEIGHT: 36px; OVERFLOW: hidden; WORD-BREAK: normal
}
.float0831 .titZx {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .titDh {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .titDc {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .icoZx {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .icoTc {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .icoFf {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .icoTl {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .btnOpen {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .btnOpen_n {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .btnCtn {
    BACKGROUND: url(../images/float_s.gif) no-repeat
}
.float0831 .titZx {
    BACKGROUND-POSITION: 5px -10px
}
.float0831 .titDh {
    BACKGROUND-POSITION: 5px -66px
}
.float0831 .titDc {
    BACKGROUND-POSITION: 5px -124px
}
.float0831 .icoZx {
    BACKGROUND-POSITION: 2px -154px
}
.float0831 .icoTc {
    BACKGROUND-POSITION: 0px -323px
}
.float0831 .icoFf {
    BACKGROUND-POSITION: 2px -213px
}
.float0831 .icoTl {
    PADDING-LEFT: 20px; DISPLAY: block; FONT-FAMILY: "微软雅黑"; BACKGROUND-POSITION: 2px -266px; FLOAT: left
}
.float0831 .btnOpen {
    BACKGROUND-POSITION: -30px -396px
}
.float0831 .btnOpen_n {
    BACKGROUND-POSITION: 0px -530px
}
.float0831 .btnCtn {
    BACKGROUND-POSITION: 0px -396px
}
.float0831 .icoZx {
    PADDING-LEFT: 28px; DISPLAY: block; FLOAT: left
}
.float0831 .icoTc {
    PADDING-LEFT: 28px; DISPLAY: block; FLOAT: left
}
.float0831 .icoFf {
    PADDING-LEFT: 28px; DISPLAY: block; FLOAT: left
}
.float0831 .btnOpen {
    POSITION: relative; WIDTH: 28px; HEIGHT: 118px; TOP: 80px; LEFT: 2px
}
.float0831 .btnOpen_n {
    POSITION: relative; WIDTH: 28px; HEIGHT: 118px; TOP: 80px; LEFT: 2px
}
.float0831 .btnCtn {
    POSITION: relative; WIDTH: 28px; HEIGHT: 118px; TOP: 80px; LEFT: 2px
}
.float0831 .btnOpen {
    TOP: 118px; LEFT: 1px
}
.float0831 .btnOpen_n {
    TOP: 118px; LEFT: 1px
}
.float0831 .btnCtn {
    TOP: 118px; LEFT: 2px
}
.float0831 UL LI H3.titDc A {
    WIDTH: 80px; DISPLAY: block; HEIGHT: 36px
}
.float0831 UL LI.top {
    BORDER-BOTTOM: #ace5f9 1px solid
}
.float0831 UL LI.bot {
    BORDER-BOTTOM-STYLE: none
}
.float0831 UL.webZx {
    PADDING-BOTTOM: 0px; PADDING-LEFT: 0px; WIDTH: 164px; PADDING-RIGHT: 0px; BACKGROUND: url(../images/webZx_bg.jpg) no-repeat; HEIGHT: 65px; PADDING-TOP: 0px
}
.float0831 UL LI.webZx-in {
    BORDER-BOTTOM-STYLE: none; PADDING-LEFT: 5px; HEIGHT: 50px; PADDING-TOP: 8px
}

 
  相关解决方案