Question

我对twitter bootstrap没有多少经验，但有很多好评，我决定将它用于我正在进行的新项目。

我想知道如何使用宽度为1170像素的新引导程序获得像素完美网格。你们是如何与之合作的？

我现在正处于设计阶段，我不想确保它在使用bootstrap构建它时能正常工作，我发现的唯一问题是我无法获得12个偶数列宽度为1170px。

网格不是像素完美的意思是列不均匀，其中一些比其他列宽。

如果你们有任何建议可以解决这个问题，请告诉我。

干杯， Thales公司

Answer 1

从头开始仔细阅读bootstrap的文档。 Bootstrap 3- Grid

如果您已阅读，请尝试

    <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Untitled Document</title>
     <link href="assets/css/bootstrap.css" rel="stylesheet" media="screen" />
    </head>

<body>
  <div class="row"> 
    <div>
    <div class="col-md-1" style="background-color:red; height:45px;"></div>
    <div class="col-md-1" style="background-color:white; height:45px;"></div>
    <div class="col-md-1" style="background-color:red; height:45px;"></div>
    <div class="col-md-1" style="background-color:white; height:45px;"></div>
    <div class="col-md-1" style="background-color:red; height:45px;"></div>
    <div class="col-md-1" style="background-color:white; height:45px;"></div>
    <div class="col-md-1" style="background-color:red; height:45px;"></div>
    <div class="col-md-1" style="background-color:white; height:45px;"></div>
    <div class="col-md-1" style="background-color:red; height:45px;"></div>
    <div class="col-md-1" style="background-color:white; height:45px;"></div>
    <div class="col-md-1" style="background-color:red; height:45px;"></div>
    <div class="col-md-1" style="background-color:white; height:45px;"></div>
  </div>
</div>



  <script src="assets/js/jquery.js"></script>
  <script src="assets/js/bootstrap.js"></script>
  <script src="assets/js/dropdown.js"></script>
</body>
</html>

如果你想要一个12个coloumns完美的像素，那么你必须用类“col-md-1”定义一个12，如上所述。

从Bootstrap 3入门开始阅读

Answer 2

尝试在photoshop中使用x2尺寸设计，你可以摆脱0.5像素，如果需要可以输出视网膜资产;）它也很容易为测试人员工作。

像素完美网格

2 个答案: