2017-3-1 bootstrap 主题学习提取记录

发表于 |

  1. 先增加一个html起始页：这是一个固定的框架：

  2. 在head里增加3个样式链接。

    1
    2
    3
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

​ 基本上就只要需要增加这三个就够了……！原来如此。

  1. 图像的响应和居中。在container里增加的图片，通常会放在左边，如何要居中，可增加.display:inline类。图片不够大时，要充满整个宽度可以增加width:100%

    ​

  2. 为整个页面增加字体。可以增加google字体库，（那么问题来了，如何不翻墙，是不是字体用不了了！）

  3. 从上图可以看出.margin { margin-bottom: 45px; }可以为整个页面的元素之后腾出更多空间。

总结：页面好看的套路：

  • 挑一个好看的字体。
  • 字与字之间不要太紧凑。
  • 为整个页面设置下margin空间。整个页面不要太紧凑。