bootstrap的使用

bootstrap中的container默认是居中的。
源码:

.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}

修改源码,添加媒体查询:当最小宽大于1220px,宽度为1220px

@media (min-width: 1220px) {
.container {
  width: 1220px;
  }
}

将container容器的样式进行加强:

fillet-container{
    padding-right: 0;
    padding-left: 0;
    overflow: hidden;
    position: relative;
    z-index: 0;
    margin-top: 25px;
    box-sizing: border-box;
    border: 1px solid rgba(0,0,0,.14);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 3px 8px -6px rgba(0,0,0,.1);
}

源码:

.row {
  margin-right: -15px;
  margin-left: -15px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

 将导航栏的圆角改成直角

@media (min-width: 768px) {
  .navbar {
    //border-radius: 4px;
     border-radius: 0px;
  }
}

 




 









posted @ 2018-12-12 09:09  payn  阅读(157)  评论(0)    收藏  举报