问题描述
我试着把问题说得更清楚。 我的问题是我的响应式 CSS 代码也可以在普通站点上运行,而不仅仅是在移动设备和其他设备上。所有行都关闭,@media only 屏幕行也关闭,整个响应式 css 部分用 } 关闭。出于某种原因,resp。代码覆盖普通代码。 如果我使用所有@media,则什么也没有发生,移动设备将网站显示为 24" 显示器。如果我使用最大 1000px 和 800px,则大部分网站都在工作。如果我只使用最大 800px,则相反网站正在运行,因此元素在最大 1000px 和 800px 梳子之间的工作方式完全相反,并且只有 800px 设置。绝对疯狂...有些尺寸在移动设备上不起作用,但可以更改颜色。
<div class="foentry">
<div class="fo1bal">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/d42.png" border="0" alt="">
</div>
<div class="fo1koz">
<h2>Rólunk</h2>
<center>Üdvözlünk mindenkit!</center><br>
Üzletünkben különleges Muffinok találhatóak,kicsiknek és nagyoknak egyaránt. Térjenek be hozzánk és kóstolják meg termékeinket,melyeket glutén,Laktóz és Cukormentes változatban is kérhetik.
</div>
<div class="fo1jobb">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/767.png" border="0" alt="">
</div>
</div>
<div class="foentry2">
<h2>Muffinjaink</h2>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/kakaos-tejcsokis.png" border="0" alt="">
<center><h4>Kakaós tejcsokis</h4></center>
</div>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/turorudi.png" border="0" alt="">
<center><h4>Túrórudis</h4></center>
</div>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/franciareggeli.png" border="0" alt="">
<center><h4>Francia reggeli</h4></center>
</div>
<div class="catgomb">
<a href="<?PHP echo home_url( '/' ); ?>category/muffinok/">Összes Muffin</a>
</div>
</div>
<div class="foentry2a">
<h2>Kávék</h2>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/cappuchino.png" border="0" alt="">
<center><h4>Cappucino</h4></center>
</div>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/coffee.png" border="0" alt="">
<center><h4>Kávé</h4></center>
</div>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/latte.png" border="0" alt="">
<center><h4>Latte</h4></center>
</div>
</div>
<div class="foentry2b">
<h2>Alkoholmentes koktélok</h2>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/batman.png" border="0" alt="">
<center><h4>Batman</h4></center>
</div>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/mickey.png" border="0" alt="">
<center><h4>Minnie Mouse</h4></center>
</div>
<div class="fo21">
<img src="<?PHP echo home_url( '/' ); ?>/wp-content/themes/kis-keep-it-simple/images/tarzan.png" border="0" alt="">
<center><h4>Tarzan</h4></center>
</div>
<div class="catgomb">
<a href="<?PHP echo home_url( '/' ); ?>category/koktelok/">Összes Koktél</a>
</div>
</div>
<div class="foentry3">
<h2>Akciók és kedvezmények</h2>
<div class="fo31">
<h3>Akció 1.</h3>
<ul>
<li>2db puncsos muffin</li>
<li class="utso">1db 0,25l Cappy</li>
</ul>
<h4>900 Ft</h4>
</div>
<div class="fo31">
<h3>Akció 2.</h3>
<ul>
<li>1db kávés+1db mákos almás muffin</li>
<li class="utso">1db 0,25l szénsavas üdítő</li>
</ul>
<h4>900 Ft</h4>
</div>
<div class="fo31">
<h3>Akció 3.</h3>
<ul>
<li>2db diós muffin</li>
<li class="utso">3dl limonádé</li>
</ul>
<h4>850 Ft</h4>
</div>
<div class="cl"> </div>
<div class="fo31">
<h3>Akció 4.</h3>
<ul>
<li>2db válaszható muffin</li>
<li class="utso">Cappucino</li>
</ul>
<h4>750 Ft</h4>
</div>
<div class="fo31">
<h3>Felnőtt akció 1.</h3>
<ul>
<li>1db válaszható muffin</li>
<li class="utso">Hosszú kávé</li>
</ul>
<h4>700 Ft</h4>
</div>
<div class="fo31">
<h3>Felnőtt akció 2.</h3>
<ul>
<li>1db kávés muffin</li>
<li class="utso">Latte</li>
</ul>
<h4>750 Ft</h4>
</div>
</div>
回复CSS:
@media only screen and (max-width: 800px) {
html{
width:100%;
height:100%;
}
#navigation{
margin:0;
padding:2% 0 0 0;
float:left;
display:block;
height:5%;
}
#navigation a{
font-size:3.5vw;
}
#header0 .blog-info {
position:absolute;
width:26%;
margin-left:38%;
margin-top:6%;
float:left;
}
.blog-info img{
width:100%;
}
.m1{
position:absolute;
float:left;
margin:0 0 0 5%;
padding:0 0 0 0;
}
.m2{
position:absolute;
float:left;
margin:0 0 0 27%;
padding:0 0 0 0;
}
.m3{
float:right;
position:absolute;
margin:0 0 0 54%;
padding:0 0 0 0;
}
.m4{
float:right;
position:absolute;
margin:0 0 0 73%;
padding:0 0 0 0;
}
.fo1bal{
width:100%;
float:left;
}
.fo1koz{
width:90%;
padding:0 5%;
float:left;
font-size:3.3vw;
line-height:1.6em;
}
.fo1koz h2{
margin:10% 0 12% 0;
font-size:4.8vw;
}
.fo1jobb{
width:100%;
float:left;
}
.foentry2
width:100%;
float:left;
}
.foentry2 h2{
margin:10% 0 12% 0;
font-size:4.5vh;
}
.fo21{
width:90%;
padding:0 5%;
margin-bottom:12vh;
}
.fo21 h4{
font-size:3vh;
margin:3vh 0 0 0;
}
.foentry2a h2{
margin:10% 0 12% 0;
font-size:4.5vh;
}
.foentry2b h2{
margin:10% 0 12% 0;
font-size:4.5vh;
line-height:1.5em;
}
}
@Admin,请在结束问题之前告诉我是否需要分享更多详细信息。我真的需要解决这个问题。 预先感谢您的支持。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)