Question

我正在研究这个wordpress博客http://www.taranmarlowjewelry.com/?page_id=7（在正常的网络浏览器上看起来很好）我试图编辑CSS，因此它在iphone上看起来不错......我在iphone css文件中添加了这些行< / p>

.wrapper{
    position:relative;
    width:840px;
    margin:0 auto;
}

.blog #page{
    width:840px !important;
}

.blog #main{
    width:840px !important;
}

.blog #primary {
    width:220px !important;
}

.blog #content {
    width: 220px !important;
}

.blog #secondary {
    width:200px !important;
    float:right !important;
}

但博客和侧边栏之间有一个巨大的空间，这个页面的宽度太宽，而我的家，关于页面看起来很好，.wrapper宽度为840px;

这里出了什么问题？

Answer 1

您是否尝试过使用初始比例？

  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

添加它并相应地调整CSS。

Answer 2

正确的方法是使用响应式主题，因此您将为所有帧格式包含base.css样式表，然后为每个新的帧格式添加样式表。类似的东西：

http://yourdomain.com/library/css/style.css'type ='text / css'media ='（min-width：481px）'/＆gt;

然后，您可以使用该样式表中的函数将更多样式应用于更大的帧格式。 Bones Theme（by theble）是一个开始学习响应式网页设计的好地方。

失败 - 肖恩是对的，从元视口设置开始并从那里进行调整。这里的iPad和iPhone屏幕尺寸有一个很好的答案iPad browser WIDTH & HEIGHT standard

安迪

Iphone上的CSS Wordpress博客

2 个答案: