【问题标题】:Disorganized CSS position on large screens大屏幕上混乱的 CSS 位置
【发布时间】:2014-01-11 14:58:20
【问题描述】:

我为 Streaming 创建了一个控制面板。 在我的分辨率 1366 x 768 中,它完美地打开,在大屏幕上,它完全杂乱无章地打开。 有谁知道是否有可能锁定 CSS 的位置,使其不会在大屏幕上“自动调整”?

帮助! 我的 CSS 代码:http://creativestreaming.com.br/admin/inc/6.css

谢谢!

【问题讨论】:

  • 问题将是因为随着宽度的增加,内容将开始并排堆叠。您可以通过使用固定宽度布局#container {width:1200px, margin:0 auto;} 来防止这种情况。我通常会使用 max-widthmin-width 而不是 width 以便内容可以调整一点,而不是太多
  • 谢谢!如何使用#container {width:1200px, margin:0 auto;}?我在哪里添加?我是 web rs 的初学者
  • 我会为您添加一个答案,并在其中包含一个示例。

标签: html css screen


【解决方案1】:

基于浏览器宽度,一种标准方法,锁定 css 是使用media queries

Check this link 关于m.q 的一般断点

这也有多个线程: Media Queries: How to target desktop, tablet and mobile? | Which are the most important media queries to use in creating mobile responsive design?

您可以只定位一个特定的浏览器宽度锁定你的CSS!

【讨论】:

    【解决方案2】:

    如果您向页面添加容器,它将阻止内容变得太宽。这是一个例子:

    HTML:

    <body>
        <div id="container">
            <!-- rest of markup here -->
        </div>
    </body>
    

    CSS:

    #container {
        max-width:1450px;
        min-width:980px;
        /*width:1200px;*/
        margin: 0 auto; 
    }
    

    我已经设置了最大值和最小值,您可以改为设置宽度 - 由您决定。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-09-28
      • 2014-04-19
      • 1970-01-01
      • 1970-01-01
      • 2018-04-12
      相关资源
      最近更新 更多