菜鸟教程小白 发表于 2022-12-12 13:19:29

移动设备上的 iOS 未正确显示 CSS 1px 边框


                                            <p><p>我有一个自定义了 CSS 边框的 Bootstrapheader ，给它一个 2px 和 1px 的阴影效果，像这样:</p>

<pre><code>&lt;div class=&#34;navbar&#34; role=&#34;navigation&#34;&gt;
    &lt;div class=&#34;header&#34;&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>CSS 是:</p>

<pre><code>.navbar{
border-bottom: 1px solid #C7C7C7;
}
.header{
border-bottom: 2px solid #EFEFEF;
}
</code></pre>

<p>页面的HTML标签是:</p>

<pre><code>&lt;meta name=&#34;viewport&#34; content=&#34;width=970&#34; /&gt;
</code></pre>

<p>由于某种奇怪的原因，当在 iPad 或 iPhone 等移动设备上查看 iOS 页面时，它没有正确显示边框。最初在加载它时，它只显示 1px 的线条，而在缩放页面时，其他 2px 是可见的，但不知何故扭曲了。整行未显示。</p>

<p>这里可能有什么问题？这是 iOS 问题还是..？</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>我找到了解决方案。我将元标记更改为:</p>

<pre><code>&lt;meta name=&#34;viewport&#34; content=&#34;width=device-width, initial-scale=1&#34;&gt;
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于移动设备上的 iOS 未正确显示 CSS 1px 边框，我们在Stack Overflow上找到一个类似的问题：
                                                        <a href="https://stackoverflow.com/questions/27586535/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/27586535/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: 移动设备上的 iOS 未正确显示 CSS 1px 边框