0

我需要骨骼方面的帮助@http ://www.slutatnian.se/skolor/nosnas/

在该站点上,代码下方有一张图片,当我在计算机上时可以正常工作。但是,如果我使用移动设备,图片会出现在屏幕底部,我希望图片在移动设备上的“Nösnäsgymnasiumet”之后,但我该怎么做?

(不要介意hotpink,我正在使用它,请参阅专栏)

这是html代码。

<div class ="container">

<div class="nosnastitel">
    <div class="eleven columns offset by one alpha" style="background-color:hotpink">
    <h3>Nösnäsgymnasiumet.</h3>
    </div>
    </div>

    <div class="six columns offset-by-one  " style="background-color:hotpink">
    <div class="infonosnas">


    <h4> Om Nösnäsgymnasiet </h4>


    <h5> Utbildning för dig </h5>
    <p> Nösnäsgymnasiet är en skola med stort utbildningsutbud, många möjligheter, kompetens och engagemang. Vi har som målsättning att du som elev skall känna dig trygg på vår skola och få en utbildning som ger dig en bra start för framtiden. </p>

    <br/>
    <h5> Gemenskap och trivsel </h5>
    <p> Här finns något för alla!
    Vi har ett stort utbud av högskoleförberedande program, yrkesprogram, introduktionsprogram, lärlingsutbildning och gymnasiesärskola.

    Hos oss kan du förbereda dig för högskolestudier eller yrkesliv, utveckla dina estetiska förmågor eller inrikta dig inom bland annat ekonomi, data, teknik och media. </p>
    <br />
    <h5>Många valmöjligheter </h5>
    <p>Nära hav och natur
    Skolan ligger på det vackra västkusten i lummig grönska och med utsikt över Hakefjorden. Ett stenkast bort finns salta bad, naturstigar och friskvårdsanläggning med simhall och idrottsplats. </p>

    <p>I skolans centrala del ligger administrationen och elevbiblioteket som är öppet varje dag. Det finns också ett elevcafé och två skolmatsalar. Med några minuters promenadväg från Stenungsunds centrum har du snabb tillgång till buss och tåg. </p>

    </div>

   </div>
   <div class="four columns offset-by-five omega">
    <div class="nosnasbild">
    <img src="skola2.jpg" alt="nosnasbild" /> </a>
    </div>
    </div>

</div>
4

1 回答 1

0

通过添加两个相同的图片但具有不同的类来解决它。之后我使用了我添加

.nosnasbild img{
     display: none; 
}

在 CSS 中。

而另一个我用作媒体查询,并使用

.nosnaspic img{
     display: none; 
}

这不是最佳解决方案,但效果很好。

于 2014-02-01T16:07:02.133 回答