0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-30 22:52:24 +01:00

Add .rounded-0 utility class (#21214)

* Add rounded-0 class
This commit is contained in:
Ken Dale 2016-11-26 19:47:53 -05:00 committed by Mark Otto
parent 095ea0b795
commit dc52029bea
2 changed files with 12 additions and 6 deletions

View File

@ -25,12 +25,13 @@ Add classes to an element to remove all borders or some borders.
Add classes to an element to easily round its corners. Add classes to an element to easily round its corners.
<div class="bd-example bd-example-images"> <div class="bd-example bd-example-images">
<img data-src="holder.js/100x100" class="rounded" alt="Example rounded image"> <img data-src="holder.js/75x75" class="rounded" alt="Example rounded image">
<img data-src="holder.js/100x100" class="rounded-top" alt="Example top rounded image"> <img data-src="holder.js/75x75" class="rounded-top" alt="Example top rounded image">
<img data-src="holder.js/100x100" class="rounded-right" alt="Example right rounded image"> <img data-src="holder.js/75x75" class="rounded-right" alt="Example right rounded image">
<img data-src="holder.js/100x100" class="rounded-bottom" alt="Example bottom rounded image"> <img data-src="holder.js/75x75" class="rounded-bottom" alt="Example bottom rounded image">
<img data-src="holder.js/100x100" class="rounded-left" alt="Example left rounded image"> <img data-src="holder.js/75x75" class="rounded-left" alt="Example left rounded image">
<img data-src="holder.js/100x100" class="rounded-circle" alt="Completely round image"> <img data-src="holder.js/75x75" class="rounded-circle" alt="Completely round image">
<img data-src="holder.js/75x75" class="rounded-0" alt="Example non-rounded image (overrides rounding applied elsewhere)">
</div> </div>
{% highlight html %} {% highlight html %}
@ -40,4 +41,5 @@ Add classes to an element to easily round its corners.
<img src="..." alt="..." class="rounded-bottom"> <img src="..." alt="..." class="rounded-bottom">
<img src="..." alt="..." class="rounded-left"> <img src="..." alt="..." class="rounded-left">
<img src="..." alt="..." class="rounded-circle"> <img src="..." alt="..." class="rounded-circle">
<img src="..." alt="..." class="rounded-0">
{% endhighlight %} {% endhighlight %}

View File

@ -31,3 +31,7 @@
.rounded-circle { .rounded-circle {
border-radius: 50%; border-radius: 50%;
} }
.rounded-0 {
border-radius: 0;
}