Twitter bootstrap 3 Bootstrap3:如何编译和下载960px的自定义宽度?如何更新?

Twitter bootstrap 3 Bootstrap3:如何编译和下载960px的自定义宽度?如何更新?,twitter-bootstrap-3,Twitter Bootstrap 3,我知道Bootstrap3使用的最大网格宽度为1170px。然而,我的客户希望他的站点使用960像素的宽度。它应缩小到960像素以下,但不能超过960像素 问题: 1.)我在960px容器的引导自定义页面上要更改什么?排水沟呢 2.)随着新版本的Bootstrap将来发布,我如何更新文件而不覆盖自定义960px文件?您可以通过转到对Bootstrap项目进行任何自定义,并更改您需要的任何内容,根据您的问题,您将执行以下更改: 对于问题的第一部分: 转到“自定义”页面,转到“容器大小”部分,在不同

我知道Bootstrap3使用的最大网格宽度为1170px。然而,我的客户希望他的站点使用960像素的宽度。它应缩小到960像素以下,但不能超过960像素

问题:

1.)我在960px容器的引导自定义页面上要更改什么?排水沟呢


2.)随着新版本的Bootstrap将来发布,我如何更新文件而不覆盖自定义960px文件?

您可以通过转到对Bootstrap项目进行任何自定义,并更改您需要的任何内容,根据您的问题,您将执行以下更改:

对于问题的第一部分:

  • 转到“自定义”页面,转到“容器大小”部分,在不同的屏幕大小上更改
    .Container
    大小

  • 转到(媒体查询断点)一节,根据您的需要对布局将更改的断点进行调整

  • 转到(网格系统)部分,并更改
    .ground
    值,我认为10px对您来说会很好。“边距值定义列之间的填充”

  • 现在作为问题的第二部分:

  • 您可以为新发布的引导执行此步骤,但请小心,因为现在您将在项目文件夹中包含文件,并且将无法使用CDN“内容交付网络”来包含引导

  • 创建一个单独的css文件,例如(media.css),仅在该文件中创建,但创建一个自定义的值(网格系统、媒体查询断点、边沟),并将其包含在主引导css之后,以及将用于项目其他部分的自定义css文件之上

    < bootstrap.css >   ----------  main css file.
    < media.css >       ----------  only for container width,breakpoints,gutter.
    < custom.css >      ----------  any other css for the project.
    
    ------------主css文件。
    ------------仅适用于容器宽度、断点和边沟。
    ------------项目的任何其他css。
    
  • 更新:

    为了让您更容易理解,请转到位于第1点的“自定义”页面,但请确保您理解以下规则:(容器宽度=您输入的值+排水沟值),以便完成所需的960px(960px=?px+?px用于排水沟)

    • 将默认边沟值
      @栅格边沟宽度
      从30px更改为20px
    • 将容器大值
      @container-large-desktop
      从1140px更改为940px
    总之,您的容器值(您需要的960px)是一个(容器宽度=您输入的值+边距值)

    然后,当你建立你的网站时,将你的元素包装在一个容器类中,你的最大值将是960px。我建议您按照以下方式划分网站页面:

    • 容器内的标题部分
    • 容器内的主体部分
    • 容器内的页脚部分
    • 同时尽可能遵循以下步骤(例如页眉、旁白、章节、文章、页脚等)

    希望这对您的项目有所帮助。

    您能帮助我了解有关“媒体查询断点”部分设置内容的更多详细信息吗?此外,我是否应该删除“@container large desktop”媒体查询,因为我不需要该大小?您不需要删除任何内容,只需更改大小即可,媒体查询断点是针对重新调整浏览器大小而不是网站宽度时会发生的情况(将是容器大小部分)你也可以上传一个线框图像到你想做的事情上,这样我可以帮你。如果你使用CSS预处理器,比如SASS或更少,这会容易得多。另外,请查看本指南:如果您使用的是Drupal引导主题,该怎么办?如何处理?