Fatal编程技术网
  • javascript/
  • Javascript在Safari和Chrome中显示，而不是在Firefox中显示？

Javascript在Safari和Chrome中显示，而不是在Firefox中显示？

javascript firefox

Javascript在Safari和Chrome中显示，而不是在Firefox中显示？,javascript,firefox,Javascript,Firefox,在这个任务中（我只能使用javascript），我的页面在Safari和Chrome中显示良好，但在firefox中显示不好。在firefox中，div“bookselection”显示在标题的右侧。知道为什么吗 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Armchair Bookstore</title>

在这个任务中（我只能使用javascript），我的页面在Safari和Chrome中显示良好，但在firefox中显示不好。在firefox中，div“bookselection”显示在标题的右侧。知道为什么吗

    <!doctype html>

<html lang="en">

<head> 
 <meta charset="utf-8">

 <title>Armchair Bookstore</title>
 <meta name="description" content="Armchair bookstore, local and online store">
 <meta name="keywords" content="books, special orders, children books">

 <link href="css/armchair.css" rel="stylesheet">


</head>

<body>

  <!-- wrapper  section starts -->
   <div id="wrapper">


  <!-- header  section starts -->
    <div id="header">
          <img src="images/header.jpg" alt="Armchair Bookstore Logo" width="975" height="230" class="floatcenter">
    </div>
  <!-- header  section ends -->


  <!-- menu  section starts -->     
    <div id="menu">
        <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="newrelease.html" id="current" class="first">New Releases</a></li>
                <li><a href="placeholder.html">Special Selection</a></li>
                <li><a href="contact.html">Contact</a></li>
                    <li><a href="placeholder.html">On Sale</a></li>
            </ul>
    </div>
        <!-- menu  section ends -->


        <!--Text starts -->
        <div id="content">
    </div>
   &nbsp;<img src="images/viewcart.jpg" alt="" width="130" height="59" class="floatright" /> 
         <div id="bookselection">
        <script type="text/javascript" src="js/armchair.js"></script>
     </div>
     <!-- Text ends -->


        <!-- footer section starts -->
    <div id="footer">
        <p class="bottom">Copyright &copy; 2012 oo Design | All Rights Reserved | <a href="#">Terms and Conditions</a></p>
    </div>
    <!-- foot section ends -->      

    <!-- wrapper section starts -->

</div>    
</body>
</html>
标准规定只能在块级元素（
display:block
）上使用
float
。显然，Chrome和Safari会自动升级
float
属性设置为
display:block
或
display:inline block的元素。因此，将
display:block
应用于您的
。floatright
：


.floatright 
{ 
   display: block;
   float: right; 
   margin: 20px;
   padding: 1px; 
   border: none;
}


还有一些提示：


  • 使用
    var myArray=new array（value0、value1、value2）创建数组时，可以初始化数组。
    • 

  • 您可以使用
    var myArray=[v0，v1，v2…]
    而不是
    var myArray=new Array（v0，v1，v2…）
    。这使您可以更轻松地创建变量：
    

    var title = ["The Innocent", "Zero Day", "The Bat", 
         "Mad River", "Low Pressure", "Zagreb Cowboy"];

    

    • 

  • 您可以使用
    ，
    对CSS选择器进行分组，规则将应用于组中的所有选择器：
    

    h1, h2, h3, h4{
   color: #2d1d06;
}
h3, h4{
   font-weight: bold;
}

    

    • 

    看起来你的CSS有问题，而不是JS。

    var title = ["The Innocent", "Zero Day", "The Bat", 
         "Mad River", "Low Pressure", "Zagreb Cowboy"];

    

    h1, h2, h3, h4{
   color: #2d1d06;
}
h3, h4{
   font-weight: bold;
}