响应网格不适应屏幕尺寸。如何调用脚本？ [英] Responsive grid not adapting to screen sizes. How do I call the script?

问题描述

我又回到这里，回答一个关于响应网格系统的问题。我有这个网站 http://www.waldenservices.com 使用响应网格系统与各种列，我有CSS代码为1024,768和480.我绝对在页面上插入css脚本，但我不知道jQuery / java代码我需要使它工作。

I am back here again with another question for responsive grid systems. I have this website http://www.waldenservices.com that uses The Responsive Grid system with various columns, I have CSS codes for 1024, 768 and 480. I am definitely inserting the css scripts on the page but I am not sure of the jQuery/java code I need to make it work.

我的问题是：我需要什么脚本调用这些CSS样式？

My questions are: What script do i need to call these css styles?

这些帮助我检测用户的屏幕尺寸吗？ （我认为Web浏览器大小是一个是我最大的关注，因为不同的用户不能看到整个页面，但必须从一侧滚动到另一侧，甚至看到整个菜单）。
任何帮助或输入都非常感谢，我真的不想重新设计整个页面。

And, Does these help me to detect the screen size of the user? (I think web browser size is one is my biggest concern, as different users cannot see the whole page but have to scroll from side to side to even see the whole menu). Any help or input is very appreciated, I really don't want to have to redesign this whole page.

谢谢你们！

推荐答案

你甚至不需要调用脚本（我不知道你的意思）

You don't even need to call script (I don't know what you meant by it), you just need responsive stylsheet.

您需要：

@media screen and (min-width: 1024px) {
  .col-5 {
    width: 50%;
  }
}

• @media 是用于媒体查询的CSS @ 规则。


• 屏幕表示这些样式仅适用于屏幕，不适用于打印机或演示文稿。


• （min-width：value） （max-width：value）用于指定将应用这些样式的最小或最大屏幕大小。您可以将（min-width）和（max-width）。


• @media is CSS @ rule, used for media queries.
• screen means these styles are just for screens, not for printers, or for presentations.
• (min-width: value) and (max-width: value) are used to specify minumum or maximum screen size on which these styles will apply. You can combine (min-width) and (max-width).

无论何时，如果您对编码响应式网格系统有问题，您可以开始使用框架（例如 Bootstrap ）。

Whenever, if you have problems with coding responsive grid systems, you can start using a framework (e.g. Bootstrap).

这篇关于响应网格不适应屏幕尺寸。如何调用脚本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！