css - 我的网站仅适用于 safari。即，chrome 和 firefox 无法识别我的 css-6ren

css - 我的网站仅适用于 safari。即，chrome 和 firefox 无法识别我的 css

转载作者：行者123 更新时间：2023-11-28 12:16:18

当我在 safari 中打开它时，一切似乎都正常，但是当我在 chrome 或 ie 或 firefox 中打开它时，图像显示缺少图像图标，并且我的 css 颜色和某些样式丢失。它在 safari 上也能完美运行，但在 ie 和 chrome 上运行相同，但在 firefox 上它完全不理解代码。这是我的 Website

如果你需要我的实际代码

HTML代码

<!DOCTYPE html>
<html>
<head>
    <script src="http://static.dudamobile.com/DM_redirect.js" type="text/javascript"></script>
<script type="text/javascript">DM_redirect("http://mobile.dudamobile.com/site/obhsmsa_host56");</script>

  <link rel="icon" type="image/x-icon" href="favicon-1.ico" />
    <title>Home</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="reset.css" type="text/css" media="screen">
    <link rel="stylesheet" href="style.css" type="text/css" media="screen">
    <link rel="stylesheet" href="grid.css" type="text/css" media="screen">   
    <script src="jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="cufon-yui.js" type="text/javascript"></script>
    <script src="cufon-replace.js" type="text/javascript"></script>
    <script src="Glegoo_400.font.js" type="text/javascript"></script> 
    <script src="FF-cash.js" type="text/javascript"></script>
    <script src="script.js" type="text/javascript"></script>      

</head>
<body id="page1">
    <!--==============================header=================================-->
    <header>
        <div class="main">
            <div class="wrapper">
                <h1><a href="index.html">OBHS MSA</a></h1>
                <nav class="fright">
                    <ul class="menu">
                        <li><a class="active" href="index.html">Home</a></li>
                        <li><a href="Disscussions.html">Discussion Question/Topics </a></li>
                        <li><a href="getinvolved.html">Get Involved</a></li>
                        <li><a href="Debates.html">Debates</a></li>
            <li><a href="leaders.html">Leaders </a></li>
                        <li><a href="gallery.html">Gallery</a></li>
                        <li><a href="contacts.html">Contacts</a></li>
                    </ul>
                </nav>
            </div><br>
        </div>
        <div class="row-bot">
            <div class="main">
                <figure class="img-indent-r"><img src="/page1-img1.png" alt="" /></figure>
                <div class="extra-wrap indent">
                    <strong class="title-1">Welcome to Old Bridge High School MSA</strong>
                    <p> <p>Old Bridge High School MSA is one of the many MSA programs worldwide. MSA history "Established in January 1963, the Muslim Students Association of the U.S. & Canada (MSA National) continues to serve Muslim students during their college and university careers by facilitating their efforts to establish, maintain and develop local MSA chapters.

First established on the campus of the University of Illinois at Urbana-Champaign by a conference of Muslim students from around the U.S. and Canada, MSA National has been a uniting forum for Muslim students from diverse backgrounds for over four decades. It continues its mission of meeting the needs of our Muslim youth on campus with the zeal and energy of the Muslim students, but requires the support of the larger community." (MSA NATIONAL)</p>
                <br></div>
                <div class="clear"></div>
            </div>
        </div>
    </header>

    <!--==============================content================================-->
    <section id="content"><div class="ic"></div>
        <div class="main">
            <div class="container_12">
                <div class="wrapper p3">
                    <article class="grid_4">
                        <div class="banner">
                            <figure><img src="/banner-1.png" alt="" /></figure><br>
                            <a class="button" href="http://msanational.org">more</a>
                        </div>
                    </article>
                    <article class="grid_4">
                        <div class="banner">
                            <figure><img src="/banner-2.png" alt="" /></figure><br>
                            <a class="button" href="http://icnany.org/site2/">more</a>
                        </div>
                    </article>
                    <article class="grid_4">
                        <div class="banner">
                            <figure><img src="/banner-3.png" alt="" /></figure><br>
                            <a class="button" href="#">more</a>
                        </div>
                    </article>
                </div>
                <div class="wrapper">
                    <article class="grid_8">
                        <h2>Upcoming Meetings</h2>
                        <div class="wrapper border-bot p3">
                            <time class="tdate-1" datetime="2012-10-21">
                                <span>Friday</span>
                                <strong>4</strong>
                            </time>
                            <div class="extra-wrap">
                                <p class="prev-indent-bot"><span class="color-1"></span></p>
                                <p>We will be staying till 4:00 inshAllah, after prayer we will be having a dissussion, or a possible special guest.</p>

                            </div>
                        </div>
                        <div class="wrapper">
                            <time class="tdate-1" datetime="2012-10-21">
                                <span>Friday</span>
                                <strong>11</strong>
                            </time>

                            <div class="extra-wrap">
                                <span class="color-1"></span><p>We will be staying till 3:15.</p>
                            </div>
                        </div>
                    </article>
                    <article class="grid_4">
                        <div class="indent-top">

                            <div class="indent-left p3">


                            </div>
                            <div class="box">
                                <div class="padding">
                                    <strong class="text-1">General Meetings</strong>
                                    <figure class="p2"></figure>
                                    <h6><strong>Friday 2:30 - 3:15</strong></h6>
                                    We have a khutbah than we have Friday prayer. Bus passes are provided. All are welcome.
                                </div>
                            </div>
                        </div>
                    </article>
                </div>
            </div>
        </div>
    </section>

    <!--==============================footer=================================-->
    <footer>
        <div class="main">
            <div class="container_12">  
                <div class="wrapper">
                    <div class="grid_8">
                        <div class="aligncenter">
                            <br> <br>OBHS MSA, ALL RIGHTS RESERVED &copy; 2013
                           </div>
                    </div>
                    <div class="grid_3 prefix_1">
                        <ul class="list-services">
                            <li><a href="https://www.facebook.com/groups/145504852207555/"></a></li>
                            <li class="item-1"><a href="https://www.twitter.com/obhs_msa"></a></li>

                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <script type="text/javascript"> Cufon.now(); </script>
</body>
</html>

我的CSS是

> /* Getting the new tags to behave */ article, aside, audio, canvas,
> command, datalist, details, embed, figcaption, figure, footer, header,
> hgroup, keygen, meter, nav, output, progress, section, source, video
> {display:block;} mark, rp, rt, ruby, summary, time {display:inline;}
> 
> /* Global properties
> ======================================================== */ html {width:100%; height:100%;}
> 
> body {font-family:Arial, Helvetica,
> sans-serif;font-size:14px;line-height:25px;color:#7f7f7f;min-width:1000px;height:100%;background:url(/body-tail.gif)
> center top repeat #0e0f0f;} .ic
> {border:0;float:right;background:#990099;color:#f00;width:50%;line-height:10px;font-size:10px;margin:-220%
> 0 0 0;overflow:hidden;padding:0} .bg {width:100%;
> background:url(/content-tail.gif) center 0 no-repeat;}
> 
> .main {   width:1000px;       margin:0 auto; }
> 
> a {color:#cc2800; outline:none;} a:hover {text-decoration:none;}
> 
> .col-1, .col-2 {float:left;}
> 
> .wrapper {width:100%; overflow:hidden;} .extra-wrap {overflow:hidden;}
> p {margin-bottom:22px;} .p1 {margin-bottom:8px;} .p2
> {margin-bottom:15px;} .p3 {margin-bottom:30px;} .p4
> {margin-bottom:40px;} .p5 {margin-bottom:50px;}
> 
> .reg {text-transform:uppercase;}
> 
> .fleft {float:left;} .fright {float:right;}
> 
> .alignright {text-align:right;} .aligncenter {text-align:center;}
> 
> .it {font-style:italic;}
> 
> .color-1 {color:#fff;} .color-2 {color:#000;} .color-3 {color:#666;}
> 
> /*********************************boxes**********************************/ .indent {padding:46px 0 0 30px;} .indent-top {padding-top:10px;}
> .indent-left {padding-left:20px;} .indent-right {padding-right:20px;}
> 
> .indent-bot {margin-bottom:20px;} .indent-bot2 {margin-bottom:18px;}
> .indent-bot3 {margin-bottom:45px;}
> 
> .prev-indent-bot {margin-bottom:10px;} .prev-indent-bot2
> {margin-bottom:5px;} .img-indent-bot {margin-bottom:25px;} .margin-bot
> {margin-bottom:35px;}
> 
> .img-indent {float:left; margin:0 20px 0px 0;}     .img-indent2
> {float:left; margin:0 13px 0px 0;}     .img-indent3 {float:left;
> margin:11px 20px 0px 0;} .img-indent-r {float:right; margin:-43px 0px
> 0px 30px;}    
> 
> .buttons a:hover {cursor:pointer;}
> 
> .menu li a, .list-1 a, .list-2 a, .link, .button, .button2, h1 a
> {text-decoration:none;}   
> 
> /*********************************header*************************************/ header {   width:100%;     background:#000;    position:relative; 
>   z-index:2; }
> 
> h1 {  padding:25px 0 24px 1px;    float:left; }   h1 a {
>       display:block;          width:458px;        height:94px;        text-indent:-9999em;
>       background:url(/logo.png) 0 0 no-repeat;    }    /***** menu *****/
> .menu {   padding:66px 29px 0 0;  } .menu li {    float:left; 
>   position:relative;  padding-left:28px; } .menu li a {
>   display:inline-block;   font-size:14px;     line-height:17px; 
>   color:#7f7f7f;  } .menu li a.active, .menu > li > a:hover
> {color:#cc2700;}
> 
> .row-bot {    width:100%;     padding: 0 0;
>   background:url(row-bot-tail.gif) center top repeat-x; } .title-1 {
>   display:block;  font-size:29px;     line-height:2em;    color:#fff;
>   letter-spacing:-2px;    margin-bottom:5px; }
> 
> /*********************************content*************************************/
> #content {    width:100%;     padding:40px 0 60px;    background:url(content-tail.gif) center top repeat;
>   position:relative;  z-index:1; }
> 
> .spacer-1 {   width:100%;     background:url(pic-1.gif) 217px 0 repeat-y;
> }
> 
> .box {    width:100%;     background:url(box-tail.gif) 0 0 repeat;
>   border-radius:5px;  -moz-border-radius:5px;
>   -webkit-border-radius:5px; }    .box .padding {padding:5px 20px 15px;}
> 
> h2 {  font-size:35px;     line-height:2em;    color:#fff;
>   letter-spacing:-3px; } h3 {     font-size:24px;     line-height:2em; 
>   color:#fff;     background:url(h3-tail.gif) 0 0 repeat;
>   border-radius:5px;  -moz-border-radius:5px;
>   -webkit-border-radius:5px;  padding-left:21px;  letter-spacing:-2px;
> } h6 {color:#fff; font-weight:normal;}
> 
> .border-bot {     width:100%;     padding-bottom:32px; 
>   background:url(pic-1.gif) 0 bottom repeat-x; }
> 
> .banner {     width:100%;     position:relative; }    .banner a {
>       position:absolute;      left:20px;      bottom:30px;    }
> 
> .button {     display:inline-block;   padding:1px 20px 8px;
>   font-size:18px;     line-height:22px;   color:#556502; 
>   background:url(button-tail.gif) 0 0 repeat-x #cdcdcd;   border:3px
> solid #fff;   cursor:pointer;     border-radius:9px;
>   -moz-border-radius:9px;     -webkit-border-radius:9px;
>   letter-spacing:-1px; } .button:hover {color:#ce0b0e;}
> 
> .button2 {    display:inline-block;   padding:5px 25px 9px;
>   font-size:22px;     line-height:27px;   color:#fff; 
>   background:url(button2-tail.gif) 0 0 repeat-x #cc2800;
>   cursor:pointer;     border-radius:6px;  -moz-border-radius:6px;
>   -webkit-border-radius:6px;  letter-spacing:-1px; } .button2:hover
> {background:#cc2800;}
> 
> .list-1 li {  font-size:14px;     line-height:19px;   font-style:italic;
>   padding:8px 0;      background:url(pic-1.gif) 0 bottom repeat-x; }
>   .list-1 a {color:#fff;}     .list-1 a:hover {color:#cc2800;}    .list-1
> .last-item {background:none;}
> 
> .list-2 li {  font-size:14px;     line-height:19px;   font-style:italic;
>   padding:8px 0;      background:url(pic-1.gif) 0 bottom repeat-x; }
>   .list-2 a {         display:inline-block;       color:#fff; 
>       padding-left:11px;          background:url(marker-1.gif) 0 8px no-repeat;
>   }   .list-2 a:hover {color:#cc2800;}    .list-2 .last-item
> {background:none;}
> 
> .link:hover {text-decoration:underline;} 
> 
> .link-1 {     display:inline-block;   font-size:14px; 
>   padding-right:8px;      background:url(marker-3.gif) right 8px
> no-repeat; } .link-1:hover {color:#fff;} 
> 
> .text-1 {     display:block;  font-size:19px;     line-height:45px;
>   color:#fff;     letter-spacing:-2px;    margin-bottom:5px; } 
> 
> dl span {float:left; width:82px; color:#fff;}
> 
> dl.years {line-height:35px;} dl.years dt {float:left; width:49px;
> color:#fff; background:url(pic-1.gif) left bottom repeat-x;} dl.years
> dd {overflow:hidden; background:url(pic-1.gif) left bottom repeat-x;}
> dl.years .last-item {background:none;}
> 
> .tdate-1 {    display:block;  width:60px;     height:60px;
>   overflow:hidden;    text-align:center;  background:url(time-bg.png) 0 0
> no-repeat;    float:left;     margin:0px 21px 0 0; }  .tdate-1 span {
>       display:block;      font-size:9px;      line-height:1.2em;      color:#fff;
>   }   .tdate-1 strong {       display:block;      font-size:37px;
>       line-height:46px;       color:#000;     }    /* -- gallery  begin --*/
> div.content img { position: relative; z-index: 2;}
> div.slideshow-container {     height: 378px;  width:600px;
>   margin-bottom:40px;     position:relative;  z-index:1;   } div.slideshow
> span.image-wrapper {  display: block;     width: 600px;   height: 378px;
>   position:absolute;  left:0;     top:0;  margin:0; } div.slideshow
> a.advance-link {  display: block;     margin: 0;  font-size:0;
>   line-height:0;  text-decoration:none; } div.slideshow
> a.advance-link:hover, div.slideshow a.advance-link:active,
> div.slideshow a.advance-link:visited {    text-decoration: none; }
> div#thumbs {  padding: 0;     width:600px; } ul.thumbs {  padding: 0 0 0
> 0;    width:100%;     overflow:hidden;    position:relative; } ul.thumbs li {
>   float:left;     margin-right:30px;  margin-bottom:30px;     width:180px;
>   height:124px; } ul.thumbs li.last {margin-right:0;} ul.thumbs
> li.last2 {margin-bottom:0;} ul.thumbs li.last3 {margin:0;}
> 
> a.thumb {display:block;} a.thumb:focus {outline: none;}
> 
> /* -- gallery end --*/
> 
> /***** contact form *****/
> #contact-form {width:600px;}
> #contact-form label {display:block; height:35px;}
> #contact-form label.message {height:324px;}
> #contact-form input {width:260px; font-size:14px; line-height:17px; color:#7f7f7f; padding:8px 20px 7px; margin:0; font-family:Arial,
> Helvetica, sans-serif; border:none; background:#fff;
> border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}
> #contact-form textarea {height:314px; min-height:314px; max-height:314px; overflow:auto; width:560px; max-width:560px;
> min-width:560px; font-size:14px; line-height:17px; color:#7f7f7f;
> padding:5px 20px; margin:0; font-family:Arial, Helvetica, sans-serif;
> border:none; background:#fff; border-radius:6px;
> -moz-border-radius:6px; -webkit-border-radius:6px;}
> 
> .buttons {padding-top:20px;} .buttons a {margin-right:10px;}      
> /****************************footer************************/ footer {
>   width:100%;     padding:30px 0 45px; }  footer span {display:block;}
> 
> .list-services {padding:19px 0 0 2px;}    .list-services li {
>       float:left;         padding:0 9px 0 0;  }   .list-services a {
>       display:block;      width:27px;         height:27px;        text-indent:-9999em;
>       background:url(social-icons.png) 0 0 no-repeat;     }   .list-services
> .item-1 a {background-position:-36px 0;}  .list-services .item-2 a
> {background-position:-72px 0;}    .list-services .item-3 a
> {background-position:-108px 0;}

最佳答案

你有这样的 img 标签:

<img src="/banner-2.png" alt="">

去掉src中的栏

<img src="banner-2.png" alt="">

或者如果图像在文件夹内添加:

<img src="images/banner-2.png" alt="">

关于css - 我的网站仅适用于 safari。即，chrome 和 firefox 无法识别我的 css，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19149544/

文章推荐： swift - SonarQube cloud for swift 不显示任何强制解包警告

文章推荐： javascript - return true 实际上返回 undefined

文章推荐： html - 放大窗口的一部分

文章推荐： iOS 11 AVPlayerViewController 禁用捏合/拖动手势

android - 适用:找不到release.keystore
我在我的 Xcode 项目目录中输入了以下内容: keytool -genkey -v -keystore release.keystore -alias mykey -keyalg RSA \
python - Pandas 适用，但访问之前计算的值
假设我有一个像这样的 DataFrame(或 Series): Value 0 0.5 1 0.8 2 -0.2 3 None 4 None 5 None
python - 冗长的 Pandas 适用
我正在对一个 Pandas 系列进行相对繁重的应用。有什么方法可以返回一些打印反馈，说明每次调用函数时在函数内部进行打印还有多远？最佳答案您可以使用跟踪器包装您的函数。以下两个示例，一个基于完成的
python - 当单元格包含列表时， Pandas 适用
我有一个 DataFrame，其中一列包含列表作为单元格内容，如下所示: import pandas as pd df = pd.DataFrame({ 'col_lists': [[1, 2
python - Pandas 适用，但仅适用于满足条件的行
我想使用 Pandas df.apply 但仅限于某些行作为一个例子，我想做这样的事情，但我的实际问题有点复杂: import pandas as pd import math z = pd.Dat
python - 如果条件适用于后续行和分组依据，则 Pandas 适用
我有以下 Pandas 数据框 id dist ds 0 0 0 0 5 1 0 0 7 2 0 0
java - gradle没有java方法的签名(hashmap.getOrDefault)适用
这发生在我尝试使用 Gradle 构建时。由于字符串是对象，因此似乎没有理由发生此错误: No signature of method: java.util.HashMap.getOrDefault(
javascript - Backbone 示例应用程序和 javascript 适用
您好，有人可以解释为什么在 remaining() 函数中的 Backbone 示例应用程序 ( http://backbonejs.org/examples/todos/index.html ) 中
grails - Grails BootStrap:无方法签名:* .addTo *适用
我有两个域类:用户 class User { String username String password String email Date dateCreated
python - 类型错误 : Positional Arguments with pandas. 适用
问题陈述: 一个 pandas dataframe 列系列，same_group 需要根据两个现有列 row 和 col 的值从 bool 值创建。如果两个值在字典 memberships 中具有相似
android - 适用:iOS 7.1 支持 MKMapItem
apporable 报告以下错误: error: unknown type name 'MKMapItem'; did you mean 'MKMapView'? MKMapItem* destina
python - 使用 API 调用时， throttle Pandas 适用
我有一个带有地址列的大型 DataFrame: data addr 0 0.617964 IN,Krishnagiri,635115 1 0.635428 IN,Chennai
c# - 无 Max() 适用 : Sequence contains no elements
我有一个列表list，里面有这样的项目 ElementA: Number=1, Version=1 ElementB: Number=1, Version=2 ElementC: Number=1,
ios - 适用: 'OBJC_CLASS_$_MKMapView' 和 'OBJC_CLASS_$_MKPinAnnotationView' 的编译失败
我正在编译我的源代码，它只是在没有运行应用程序的情况下终止。这是我得到的日志: Build/android-armeabi-debug/com.app4u.portaldorugby/PortalDo
python - 'numpy.float6 4' object has no attribute ' 适用'
我正在尝试根据另一个单元格的值更改单元格值(颜色“红色”或“绿色”)。我运行以下命令: df.loc[0, 'Colour'] = df.loc[0, 'Count'].apply(lambda x:
scalaz List[StateT].sequence - 找不到参数 n 的隐式值 : scalaz. 适用
我想弄清楚如何使用 StateT结合两个 State基于对我的 Scalaz state monad examples 的评论的状态转换器回答。看来我已经很接近了，但是在尝试申请 sequence
c# - 如果源绑定(bind)适用，如何访问快速访问工具栏命令 `Add to Quick Access Tool`
如果我已经为它绑定(bind)了集合，我该如何添加 RibbonLibrary 默认的快速访问项容器。当我从 UI 添加快速访问工具项时，它会抛出 Operation is not valid whi
haskell - 适用:证明 `pure f <*> x = pure (flip ($)) <*> x <*> pure f`
在我学习期间Typoclassopedia我遇到了这个证明，但我不确定我的证明是否正确。问题是: One might imagine a variant of the interchange law

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

css - 我的网站仅适用于 safari。即，chrome 和 firefox 无法识别我的 css