解决bootstrap-paginator的CSS与原生bootstrap CSS冲突问题

原创 2017年01月03日 03:47:12
其实解决思路很简单只要,bootstrap-paginator所用到的bootstrap.min.css中的css元素提取出来,并放入原生bootstrap.min.css,不使用bootstrap-paginator的bootstrap.min.css就好了。

我用火狐一个一个提取出了这些Css元素,你们直接复制就好了:
form {
    margin: 0 0 20px;
}
.pagination-centered {
    text-align: center;
}
.pagination {
    margin: 20px 0;
}
.pagination ul {
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    display: inline-block;
    margin-bottom: 0;
    margin-left: 0;
}
ul, ol {
    margin: 0 0 10px 25px;
    padding: 0;
}
.pagination ul > li {
    display: inline;
}
li {
    line-height: 20px;
}
.pagination ul > li:first-child > a, .pagination ul > li:first-child > span {
    border-bottom-left-radius: 4px;
    border-left-width: 1px;
    border-top-left-radius: 4px;
}
.pagination ul > li:last-child > a, .pagination ul > li:last-child > span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}
.pagination ul > li > a, .pagination ul > li > span {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #fff;
    border-color: #ddd;
    border-image: none;
    border-style: solid;
    border-width: 1px 1px 1px 0;
    float: left;
    line-height: 20px;
    padding: 4px 12px;
    text-decoration: none;
    cursor:pointer;
}
.pagination ul > .active > a, .pagination ul > .active > span {
    color: #999;
    cursor: default;
}
.pagination ul > li > a:hover, .pagination ul > li > a:focus, .pagination ul > .active > a, .pagination ul > .active > span {
    background-color: #f5f5f5;
}

【问题解决】BootStrap.css与layDate日期选择样式起冲突的解决办法

转载请注明出处:http://blog.csdn.net/qq_26525215 本文源自【大学之旅_谙忆的博客】  问题如图: 给大家看下正常的layDate年份选择图片: 一开始想到的,以...

bootstrap.css和esayUi.css样式冲突的解决

在使用bootstrap和easyui的时候,发现很多有冲突的地方,包括datagrid控件和combo等,以下进行的问题修正,保证easyui正常显示 原理就是还原easyui中的默认设置,让...

Bootstrap结合BootstrapTable的使用

Bootstrap结合BootstrapTable的使用,分为两种模试显示列表。 引用的css:       引用的JS: 常用方法: 刷新表格:$table.bootstrapTable(...

select2与Bootstrap冲突解决

需要在bootstrap.css , select2.css 后加入下面的css /*** Select2 Plugin ***/ .form-control .select2-choice { ...

CSS 的优先级机制(无法覆盖bootstrap的样式)

前几天遇到了一个问题就是,我在引入bootstrap,以下简称btp。 一般情况下我们知道CSS优先级是:内联》内部》外部样式,但是有一个例外就是,由于浏览器的加载和渲染顺序是由上到下的,所以加入...

原生JS+css3实现bootstrap模态框

  • 2015年08月20日 16:27
  • 5KB
  • 下载

bootstarp分页插件 bootstrapv3.css 与 bootstrap.min.css 样式冲突

bootstarp css 样式 冲突
  • xzy99
  • xzy99
  • 2017年08月06日 16:14
  • 404

问题总结(ng+bootstrap+css)

1.tab,ng无嵌套路由,tab也不需要用到。用angular-ui-bootstrap的tabset, tabcontent分别是不同的ng-include。不同的controller。 2.b...

nodejs分页设计配合bootstrap-paginator

原帖地址:http://blog.fens.me/nodejs-bootstrap-paginator/ 从零开始nodejs系列文章,将介绍如何利Javascript做为服...
  • comhaqs
  • comhaqs
  • 2014年04月16日 09:38
  • 970
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:解决bootstrap-paginator的CSS与原生bootstrap CSS冲突问题
举报原因:
原因补充:

(最多只允许输入30个字)