rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-02 14:24:19 +01:00
Code Issues Actions Packages Releases Activity

Port #13996 over to hosted docs

Browse Source
This commit is contained in:
Chris Rebert 2014-09-26 17:57:34 -07:00
parent 5b4bf03a0c
commit 3625fc01fa
1 changed files with 4 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
css/index.html
View File

@ -2507,6 +2507,10 @@ To edit settings, press <span class="nt">&lt;kbd&gt;&lt;kbd&gt;</span>ctrl<span
<h2 id="images-responsive">Responsive images</h2>
<p>Images in Bootstrap 3 can be made responsive-friendly via the addition of the <code>.img-responsive</code> class. This applies <code>max-width: 100%;</code> and <code>height: auto;</code> to the image so that it scales nicely to the parent element.</p>
<div class="highlight"><pre><code class="html"><span class="nt">&lt;img</span> <span class="na">src=</span><span class="s">&quot;...&quot;</span> <span class="na">class=</span><span class="s">&quot;img-responsive&quot;</span> <span class="na">alt=</span><span class="s">&quot;Responsive image&quot;</span><span class="nt">&gt;</span></code></pre></div>
<div class="bs-callout bs-callout-warning">
<h4>SVG images and IE 8-10</h4>
<p>In Internet Explorer 8-10, SVG images with <code>.img-responsive</code> are disproportionately sized. To fix this, add <code>width: 100% \9;</code> where necessary. Bootstrap doesn't apply this automatically as it causes complications to other image formats.</p>
</div>
<h2 id="images-shapes">Image shapes</h2>
<p>Add classes to an <code>&lt;img&gt;</code> element to easily style images in any project.</p>