mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
fixes #4935: properly comment responsive image techniques and add CSS tests to support
This commit is contained in:
parent
8cda830eaf
commit
acf2a64016
2 changed files with 42 additions and 2 deletions
|
@ -77,9 +77,11 @@ sub {
|
|||
// -------------------------
|
||||
|
||||
img {
|
||||
max-width: 100%; // Make images inherently responsive
|
||||
/* Responsive images (ensure images don't scale beyond their parents) */
|
||||
max-width: 100%; /* Part 1: Set a maxium relative to the parent */
|
||||
width: auto\9; /* IE7-8 need help adjusting responsive images */
|
||||
height: auto; // Make images inherently responsive
|
||||
height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */
|
||||
|
||||
vertical-align: middle;
|
||||
border: 0;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
|
|
|
@ -98,6 +98,44 @@
|
|||
|
||||
|
||||
|
||||
<!-- Responsive images
|
||||
================================================== -->
|
||||
|
||||
<div class="page-header">
|
||||
<h1>Responsive images</h1>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<img src="http://placehold.it/600x600" height="200">
|
||||
</div>
|
||||
<div class="span4">
|
||||
<img src="http://placehold.it/600x600">
|
||||
</div>
|
||||
<div class="span4">
|
||||
<img src="http://placehold.it/600x600">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<img src="http://placehold.it/600x900" style="width: 200px;">
|
||||
</div>
|
||||
<div class="span4">
|
||||
<img src="http://placehold.it/200x300">
|
||||
</div>
|
||||
<div class="span4">
|
||||
<img src="http://placehold.it/600x600">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Fluid grid
|
||||
================================================== -->
|
||||
|
||||
|
|
Loading…
Reference in a new issue