缓慢的网页速度

-1

在加载页面之前，我的网页变成白色一秒钟，似乎并不像所有的背景图像一起加载（或者它们或者它们不在汇）。我做了一些研究发现了一些关于精灵（没有工作），也改变了图片从jpg-> png-> gif和回（我甚至穿过几个）有人可以帮助我解决这个问题。 PS。不要介意一堆“国王”，他们只是占位符，看看背景如何跨越。 - 谢谢缓慢的网页速度

CSS：

* { 
     margin:0px; 
     padding:0px; 

     list-style-type:none; 
     } 
     html{ 

     background-image:url("Aba2.jpg"); 
     -webkit-background-size:cover; 
     -moz-background-size:cover; 
     -o-background-size:cover; 
     background-size:cover; 
     text-align:center; 

     } 
     header, section, footer, aside, nav,article{display:block} 

     #Wrapper{ 

     width:1100px; 
     margin:20px auto; 


     } 
     #H_wrap{ 
     padding:10px; 
     height:150px; 
     background-image:url("Abracci1.jpg"); 
     background-repeat:repeat-x; 
     -webkit-background-size:cover; 
     -moz-background-size:cover; 
     -o-background-size:cover; 
     background-size:cover; 

     } 

     #M_head{ 
     padding:10px; 
     font:italic bold 34px/30px "Times New Roman" Times, arial; 
     Text-align:center; 
     color:#000000; 
     text-shadow:2px 2px #999999; 
     text-decoration:underline; 


     } 

     #N_bar { 
     padding:40px; 
     text-align:center; 
     word-spacing:6em; 
     font:italic bold 25px/30px "Times New Roman" Times, arial; 
     text-shadow:3px 3px grey; 


     } 

     a:link.NB{ 
     color:white; 
     } 
     a:visited.NB{ 
     color:black; 
     } 
     a:hover.NB{ 
     color:GOLD; 
     } 
     a:active.NB{ 
     color:#423243; 
     } 


     #N_bar li{ 
     display:inline-block; 
     } 

     #M_section{ 
     background-image:url("Aba3.jpg"); 
     background-position:center; 
     padding:20px; 
     -webkit-background-size:cover; 
     -moz-background-size:cover; 
     -o-background-size:cover; 
     background-size:cover; 
     } 
END CSS.  
HTML: 
     <!Doctype html> 
    <html lang="eng"> 
    <head> 
    <meta charset="uft-8"/> 
    <link rel="stylesheet" href="Abracci_main.css"/> 
    </head> 
    <html> 
    <body> 
     <div id="Wrapper"> 
     <div id="H_wrap"> 

      <header id="M_head"> 
      <h1>Abracci</h1> 
      </header> 


      <nav id="N_bar"> 
       <ul> 

        <li><a class="NB" href="https://css-tricks.com/perfect-full-page-background-image/">Men</a></li> 
        <li><a class="NB" href="#">Women</a></li> 
        <li><a class="NB" href="#">Children</a></li> 
        <li><a class="NB" href="#">Apparel</a></li> 
       </ul> 
      </nav> 
      </div> 
      <section id="M_section"> 
        <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> <li>King</li> 

      </section> 
      <aside id="M_aside"> 

      </aside> 
      <footer id="M_footer"> 

      </footer> 

      </div> 



    </body> 
    </html> 

     } 
END HTML.

来源

2015-03-08 Jayden Freh

您可以提供一个示例使用？什么图像没有加载，文件名是否正确？没有足够的信息给我们知道问题可能是什么 – 2015-03-08 21:26:47

哦，对不起，我的网页离线，所以我不能测试速度或“验证”它，但我很肯定，它非常缓慢，因为当我刷新或切换链接屏幕变为空白，然后出现的话就会出现背景。我想知道是否有办法阻止这种情况发生。 – 2015-03-09 00:36:31

使用validator,和浏览器开发者工具中铬，Firefox或Internet Explorer。净选项卡会告诉你到底发生了什么。请修复您的问题的格式（缺少html标签，额外的}等

来源

2015-03-08 20:51:41 user1133275

缓慢的网页速度

回答

相关问题