解决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年份选择图片: 一开始想到的,以...

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

bootstarp css 样式 冲突
  • xzy99
  • xzy99
  • 2017-08-06 16:14
  • 123

问题总结(ng+bootstrap+css)

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

Bootstrap Paginator分页插件超详细使用示例

--------jsp页面只需要两个div,一个用于拼接table,一个放分页相关页码

利用JS和CSS的覆盖特性来解决文件冲突问题

JS文件冲突了,肿么办?CSS文件冲突了,肿么办。看这里。。。希望能找到你想要的答案。

nodejs分页设计配合bootstrap-paginator

原帖地址:http://blog.fens.me/nodejs-bootstrap-paginator/ 从零开始nodejs系列文章,将介绍如何利Javascript做为服...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

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