为什么<hr />标签在网站上不可见?

时间:2013-03-21 13:07:24

标签: html css web

hr标签完美无缺,然后即使标签位于html代码中也没有消失。对于所有页面都是如此,但我的Dreamweaver模板页面中没有任何hr标签css代码。下面是我发生这种情况时正在处理的jsfiddle页面代码。

<hr>

http://jsfiddle.net/DuDjK/1/

完整代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/template.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OBDKey</title>
<style type="text/css">
#footer {
    color: #5A87B4;
}
</style>
</head>

<style type="text/css">

    *{
        margin:0;
        padding:0;
        border:0;
        font-family: Helvetica, sans-serif;
        -webkit-text-size-adjust:none;
    }


#menubar * { padding: 0; margin: 2; }
        body {font-family: Helvetica, Arial, sans-serif; width:100%; font-size:12px}
        #menubar ul{
text-align:center;
}
        #menubar ul li { display:inline-block; padding: 2px;  position: relative; margin-left:-10px; margin-right:-20px; margin:invisible; }
        #menubar ul a { display: table-cell; vertical-align: middle; width: 80px; height: 30px; text-align:center; background: #FFF; color:#000; border-style: solid; border-width:2px; border-color:#1570a6; text-decoration: none; }
#menubar li:after{
     border-left:50px solid black;
   border-right:60px solid black;
   content:"";
   position:relative;
   left:-12px;
   top:-18px;  
   z-index:-1;
   display:block;
   height:1px;
}





#cssmenu {
    background: #E6E6E6;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}
#cssmenu li {
    font: 100% 'Helvetica', 'Bitstream Vera Sans', 'Trebuchet Unicode MS', 'Lucida Grande', Verdana, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
       list-style: none;
}
#cssmenu a {
    background: #E6E6E6;
    border-bottom: 1px solid #F2F2F2;
    color: #000;
    display: block;
    margin: 0;
    padding: 8px 12px;
    text-decoration: none;
    font-weight:normal;
}
#cssmenu a:hover {
    background: #E6E6E6 url(images/menuhover.png) left center no-repeat;
    color: #1570A6;
    padding-bottom: 8px;
}





    #header {
    text-align: center;
    background: #FFA500;
    height: inherit
    padding: 15px 0;
    border: 0;
    }

    #footer {
    background:#5A87B4;
    padding:20px 0;
    text-align:center;
    }


#footer {
    color: #5A87B4;
}
#footer {
    color: #FFFFFF;
    font-size: 12px;
}
.footertextsize {
    font-size: 10px;
}
.font-color {
    color: #5A87B4;
}
heading {
    color: #000;
}

#header #checkout p {
    color: #FFF;
}
</style>

<body>

<div id="header"  >
    <div id="checkout">
      <p align="right"><a href="Home.html"><img src="images/obdlogo.png" align="left" /></a></p>
  <p align="right"><strong><a href="Order%20Online.html">BUY </a></strong></p>
  <p align="right"><a href="Order%20Online.html"><strong>NOW</strong></a></p>
  <p align="right">&nbsp;</p>
  <p align="right">&nbsp;</p>
  </div>
  <hr style="height:5px; background-color:#FFF; solid #FFF; border:0"  />
  <hr style="height:5px; background-color:#1570a6; solid #1570a6; broder:0"  />
  <hr style="height:5px; background-color:#FFF; solid #FFF; border:0"  />
  <hr style="height:5px; background-color:#1570a6; solid #1570a6; broder:0"  />
  <hr style="height:5px; background-color:#FFF; solid #FFF; border:0"  />
  <hr style="height:5px; background-color:#1570a6; solid #1570a6; broder:0"  />
</div>
<div id="menubar"> 
    <ul>
    <li>
      <a href="Software.html" ><strong>SOFTWARE</strong></a>
    </li>
      <li><a href="Products.html"><strong>PRODUCTS</strong></a></li>
    <li>
    <a href="FAQ.html"><strong>FAQ</strong></a></li>
    </ul>
</div>




<p>&nbsp;</p>
<p>&nbsp;</p>
<!-- InstanceBeginEditable name="EditRegion1" -->
<p><strong>Press Information, News and Reviews</strong></p>
<p>&nbsp;</p>
<p class="font-color">&nbsp;</p>
<p class="font-color"><strong>January 2012: New OBDKey Interface Distributor for Germany, Austria and Switzerland</strong></p>
<p class="font-color">&nbsp;</p>
<p class="font-color">From January 2012 OBDKey units are available to purchase from our new distributor for German speaking countries: <strong>Electronic-Fuchs</strong>.</p>
<p class="font-color">&nbsp;</p>
<p class="font-color"><img src="images/Fuchs_Banner.jpg" width="296" height="77" alt="fuchs" longdesc="file:///C|/Users/Production/Desktop/Mobile Website/Mobile Website/images/Fuchs_Banner.jpg" /></p>
<p class="font-color">&nbsp;</p>
<p class="font-color">&nbsp;</p>
<hr>
<p>
<p>
<p class="font-color"><strong>November 2011: OBDKey Recieves &quot;Recommended&quot; Award from Car Mechanics Magazine</strong></p>
<p class="font-color">&nbsp;</p>
<p class="font-color"><img src="images/carmechmagrec.jpg" alt="carmechmagrec" width="120" height="128" longdesc="images/carmechmagrec.jpg" align="left" />&quot;The Bluetooth in the name gives it away - here's a package that means you don't have to be permanently connected to your car during diagnostics session. But, as handy as that is, the real bonus of the Bluetooth is that this package can be run on a plethora of mobile phones and personal organisers, instead of just a laptop.<img src="images/carmechmag.jpg" alt="carmechmag" width="100" height="139" longdesc="images/carmechmag.jpg" align="right" /></p>

<p class="font-color">&nbsp;</p>
<p class="font-color">&nbsp;</p>
<p class="font-color"><em>The bundled programme is businesslike, works works well and even goes beyond-OBD on VAG cars&quot;</em></p>
<p class="font-color">&nbsp;</p>
<p class="font-color"><em><strong>&quot;Value for money 6/6&quot;</strong></em></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>
<hr />
<p>
<p>
<p class="font-color"><strong>September 2011: OBDKey WLAN Shipping in smaller Casing</strong>
<p class="font-color">
<p class="font-color">
<br />
<p class="font-color"><img src="images/obdkeywifism.jpg" alt="wlansm" width="112" height="88" longdesc="images/obdkeywifism.jpg" align="right" />
<p class="font-color">From September 2011 all OBDKey WLAN units will be shipped in the standard OBDKey case with dimensions 62x45x24 mm (65x45x24 mm including accessory loop).
<p class="font-color">
<p class="font-color">Approved for connection to wireless LAN devices and fully tested on OBD-II compatible vehicles and systems.
<p>
<br />
<p>
<p class="font-color"><strong><a href="obdkeywlanpressrelease.pdf">Press release</a></strong>
<p><br />
<p class="font-color"><strong><a href="WLAN.html">More information</a></strong>
<p class="font-color">
<p class="font-color">
<hr />
<p class="font-color"><!-- InstanceEndEditable -->
<p class="font-color">&nbsp;</p>
<p class="font-color">&nbsp;</p>
<p class="font-color">&nbsp;</p>
<div id='cssmenu'>
  <ul>
    <li><a href="#">Contact Us<strong></strong></a></li>
    <li><a href="About%20Us.html">About Us</a></li>
    <li><a href="Support.html">Get Support</a></li>
    <li><a href="#">Press</a></li>
  </ul>
</div>
<p class="font-color"><br />
</p>

<div class="footertextsize" id="footer">
  <p>&nbsp;</p>
  <p><strong><a href="http://www.obdkey.com">View Desktop Site</a></strong></p>
  <p>&nbsp;</p>
  <p><strong>Copyright © Copyright (C) 2011 KBM Systems Ltd.</strong></p>
  <p>&nbsp;</p>
  <p><strong>OBDKey is a registered  trademark of KBM Systems Ltd.</strong></p>
  <p>&nbsp;</p>
</div>
<p>&nbsp;</p>
<div id='cssmenu'>
  <ul>
    <li><a href="Copyright%20Notice.html">Copyright Notice </a></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>
<p>&nbsp;</p>
</body>
<!-- InstanceEnd --></html>

1 个答案:

答案 0 :(得分:2)

由于这个选择每个元素的通用选择器:

* {
margin:0;
padding:0;
border:0;
font-family: Helvetica, sans-serif;
-webkit-text-size-adjust:none;
}

这只是从<hr>

中删除边框