Question

网站：http://ovi-opus2.rightnowdemo.com/app

这是页脚....如果有人知道如何解决这个问题，请告诉我。似乎http://validator.w3.org/检测到一些错误，它表示此时元素a上不允许属性alt。 ... el =“nofollow”href =“http://www.youtube.com/user/”＆gt; YouTube

<div class="footerbackground">
    <div class="footercontent">
        <div class="main">
            <div class="footersocial">
                <ul id="footersocial">
                    <li id="facebook_foot"><a title="Facebook" alt="Facebook" target="_blank" rel="nofollow" href="http://www.facebook.com/OpusDev"><span>Facebook</span></a></li>
                    <li style="height: 15px!important; padding: 10px 30px 0px 0px!important"><a target="_blank" href="http://www.facebook.com/OpusDev">Facebook</a></li>
                    <li id="twitter_foot"><a title="Twitter" alt="Twitter" target="_blank" rel="nofollow" href="http://twitter.com/#!/opus311"><span>Twitter</span></a></li>
                    <li style="height: 15px!important; padding: 10px 30px 0px 0px!important"><a target="_blank" href="http://twitter.com/#!/opus311">Twitter</a></li>
                    <li id="youtube_foot"><a title="YouTube" alt="YouTube" target="_blank" rel="nofollow" href="http://www.youtube.com/user/"><span>YouTube</span></a></li>
                    <li style="height: 15px!important; padding: 10px 30px 0px 0px!important"><a target="_blank" href="http://www.youtube.com/user/">YouTube</a></li>
                    <li id="flickr_foot"><a title="Flickr" alt="Flickr" target="_blank" rel="nofollow" href="http://www.flickr.com/"><span>Flickr</span></a></li>
                    <li style="height: 15px!important; padding: 10px 30px 0px 0px!important"><a target="_blank" href="http://www.flickr.com/">Flickr</a></li>
                    <!--<li id="mobile"><a href="http://itunes.apple.com/gb/app/denver-311/id484143327?mt=8" rel="nofollow" target="_blank"
                        alt="Mobile" title="Mobile"><span>Mobile</span></a></li>-->
                    <li id="RSS_foot"><a title="RSS News Feed" alt="RSS News Feed" rel="nofollow" href="/DesktopModules/Orizonti_NukeNews/getRSS.aspx?pid=728&amp;tid=442244&amp;mid=504977 "><span>RSS</span></a></li>
                    <li style="height: 15px!important; padding: 10px 30px 0px 0px!important"><a target="_blank" href="/DesktopModules/Orizonti_NukeNews/getRSS.aspx?pid=728&amp;tid=442244&amp;mid=504977">Newsfeed</a></li>
                    <li id="opendata"><a title="Open Data Catalog" alt="Open Data Catalog" rel="nofollow" href="http://opus311.com/"><span>Open Data Catalog</span></a></li>
                    <li style="height: 15px!important; padding: 10px 30px 0px 0px!important"><a target="_blank" href="http://opus311.com/">Open Data Catalog</a></li>
                </ul>
            </div>
            <footer>
                <div class="col_1">
                    <h3>Stay Informed</h3>
                    <ul class="list1">
                        <li><a target="_blank" href="/connectdenver">Connect with Opus</a></li>
                        <li><a href="/emergencyalerts">Emergency Alerts</a></li>
                        <li><a href="/connectdenver">News &amp; Subscriptions</a></li>
                        <li><a href="/mayorblog">Mayor's Blog</a></li>
                        <li><a href="/connectdenver">More</a></li>
                    </ul>
                </div>
                <div class="col_2">
                    <h3>Apps &amp; Tools</h3>
                    <ul class="list1">
                        <li><a href="/connectdenver">Connect Opus App</a></li>
                        <li><a href="/apps4/311">311 Help App</a></li>
                        <li><a href="/recprograms">Recreation App</a></li>
                        <li><a href="/property">Property App</a></li>
                        <li><a href="/onlineservices">More</a></li>
                    </ul>
                </div>
                <div class="col_3">
                    <h3>Services</h3>
                    <ul class="list1">
                        <li><a href="/onlineservices">Online Services</a></li>
                        <li><a href="/livingindenver">Neighborhood Services</a></li>
                        <li><a href="/doingbusiness">Business Services</a></li>
                        <li><a href="/citygovernment">Government Services</a></li>
                        <li><a href="/atoz">More</a></li>
                    </ul>
                </div>

                <div class="col_4"><h3>Get Help</h3><div id="footer_logo"><a title="Denver 311 Help Center" href="/311" class="footer_logo"></a></div>
                </div></footer></div>
                <div class="clear"></div>
                <div class="footerbar">

                    &copy; Copyright 2014 Opus Group LLC  |  <a href="/jobs">Jobs</a> | <a href="/atoz">A to Z Services</a> | <a href="/terms">Terms of Use</a> | <a href="/privacy">Privacy &amp; Security Policy</a>
                    <a href="javascript:__doPostBack('dnn$dnnLOGIN$cmdLogin','')" class="login" id="dnn_dnnLOGIN_cmdLogin">Login</a>
                </div>

        </div>
    </div>

Answer 1

嗯，你的代码非常混乱，但是对于我在W3验证器中可以看到的内容，你会遇到很多由非封闭元素引起的错误。只需转到your page validation results并逐行检查检测到的所有29个问题。然后尝试your site's CSS issues，调试，如果问题仍然存在，那么至少它将更容易隔离它。注意第794行中的CSS结果，你有一些非常奇怪的错误会阻止页面快速加载并可能导致非渲染问题。可能是一个非封闭的项目，但实际上，有很多要分析

现在，当你遇到这么多问题时，找不到问题是不可能的

Answer 2

很难从这里给出的代码中判断出来（如果你确实有一个关闭页脚标记，我建议编辑你的问题以包含它），但是从你给出的网站链接看起来就是这样＃39 ;您的CSS部分可能无法正确导入。出于某种原因，Chrome似乎正在提升风格，但其他浏览器并非如此。 Chrome往往会忽略一些编码错误，无法呈现其他人不在的页面。

例如，您的h3样式将从外部样式表以外的其他位置拉出。看看这些样式的来源（称为＆＃34; app＆＃34;）并尝试修复导入这些样式的方式。

当我在firefox / IE中测试它时，网站页脚是不正常的，但在Chrome中工作正常

2 个答案: