Bootstrap Paginierung CSS Grenze um dicker machen, aber nicht das Innere

Question

Wie kann ich Bootstrap Paginierung CSS Grenze um dicker machen, aber nicht das Innere eines? wie dieses Bild unten?

Ich habe versucht, aber die CSS verwendet Ich mache alle, jemand mir auf diesem helfen könnte? Vielen Dank.

html:

<ul class="pagination pull-right"> 
    <li><a href="#">First</a></li> 
    <li class="disabled"><a href="#">Previous</a></li> 
    <li class="active"><a href="#">1</a></li> 
    <li><a href="#">2</a></li> 
    <li><a href="#">3</a></li> 
    <li><a href="#">4</a></li> 
    <li><a href="#">5</a></li> 
    <li><a href="#">...</a></li> 
    <li><a href="#">116</a></li> 
    <li><a href="#">Next</a></li> 
    <li><a href="#">Last</a></li> 
    </ul> 

css:

.pagination>li>a, .pagination>li>span { 
    border: 4px solid #ddd; 
} 

js Geige: https://jsfiddle.net/8hnhmxh8/

Answer 1

.pagination { 
    border: 4px solid #ddd; 
} 
.pagination > li > a { 
    border: 1px solid #ddd; 
    border-radius: 0px!important; 
} 

JSFIDDLE

Answer 2

Problem ist, dass die Grenze auf dem a-Tag ist, nicht den li-Tag. Aber versuchen Sie dies:

.pagination>li>a, .pagination>li>span { 
    border-top: 4px solid #ddd; 
    border-bottom: 4px solid #ddd; 
} 

.pagination>li:first-of-type > a { 
    border-left: 4px solid #ddd; 
} 

.pagination>li:last-of-type > a { 
    border-right: 4px solid #ddd; 
} 

https://jsfiddle.net/8hnhmxh8/1/

Answer 3

Anstatt die Grenze auf li Element Anwendung tun es nur auf ul Element.

.pagination { 
    border: 4px solid #ddd; 
} 

Answer 4

Sie Grenze aktualisieren.

.ul { border:1px solid black; padding:10px; }

Ich habe Ihren Code gegabelt.

https://jsfiddle.net/4p7413jz/1/

Hoffe, es funktioniert !!!