0

这是我的网站： http: //foxweb.marist.edu/users/kf79g/contact.php

测试网站：http ://www.responsinator.com/?url=http%3A%2F%2Ffoxweb.marist.edu%2Fusers%2Fkf79g%2Fcontact.php

在我的联系页面上，我希望表单以及文本和图标在所有屏幕尺寸上都尽可能大，并且在页面上居中。特别是在平板电脑等中等尺寸的屏幕上（参考测试网站链接），您可以看到页面上有大量的空白区域，而且内容本身非常小。这就是为什么我想通过扩大所有内容来使页面更易于查看。

我的所有代码都位于这些文件下的页面源代码中（在浏览器上右键单击查看源代码后）：

screen_styles.css

screen_layout_large.css

screen_layout_small.css

screen_layout_medium.css

联系人.php

我尝试了我所知道的一切来修复它，但我被证明是不成功的。我尽我所能将整个事物居中，但即使在中小屏幕上也不完全（请参阅表单和图标的设置方式以查看测量是否关闭）。在小屏幕上，稍微离开页面会破坏我的响应式设计。完成后，我的网站终于完成了。请帮帮我，我需要尽快完成这项工作。我真的很感激任何帮助。

4

1 回答 1

0

使用媒体查询（您决定断点值）并将新样式设置为#contact_section如下示例

@media screen and (max-width: 640px){
    #contact_section {
        float:none;
        display: block;
        width: 96%;
        padding: 2%;
        box-shadow: none; /*if don't want any shadow*/
    }
}

p/s：640px是断点值的例子

于 2013-06-25T02:12:31.910 回答