From 0156f9a2379b68cd3cf284bc4e7799fda221203e Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 17 Apr 2015 12:41:49 -0700 Subject: move remaining files to components subdir --- docs/content/images.md | 74 -------------------------------------------------- 1 file changed, 74 deletions(-) delete mode 100644 docs/content/images.md (limited to 'docs/content/images.md') diff --git a/docs/content/images.md b/docs/content/images.md deleted file mode 100644 index e7b29d45a..000000000 --- a/docs/content/images.md +++ /dev/null @@ -1,74 +0,0 @@ ---- -layout: page -title: Images ---- - -Opt your images into responsive behavior (so they never become larger than their parent elements) and add lightweight styles to them—all via classes. - -## Responsive images - -Images in Bootstrap are responsive by default. `max-width: 100%;` and `height: auto;` are applied to the image so that it scales with the parent element. - -
- Generic responsive image -
- -{% highlight html %} -Responsive image -{% endhighlight %} - -{% callout warning %} -#### SVG images and IE 9-10 - -In Internet Explorer 9-10, SVG images with `.img-responsive` are disproportionately sized. To fix this, add `width: 100% \9;` where necessary. Bootstrap doesn't apply this automatically as it causes complications to other image formats. -{% endcallout %} - -## Image shapes - -Add classes to an `` element to easily style images in any project. - -
- A generic square placeholder image with rounded corners - A generic square placeholder image where only the portion within the circle circumscribed about said square is visible - A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera -
- -{% highlight html %} -... -... -... -{% endhighlight %} - -## Aligning images - -Align images with the [helper float classes](/components/helpers) or [text alignment classes](/components/helpers). A simple centering class can also be used for `block` level images. - -
- A generic square placeholder image with rounded corners - A generic square placeholder image with rounded corners -
- -{% highlight html %} -... -... -{% endhighlight %} - -
- A generic square placeholder image with rounded corners -
- -{% highlight html %} -... -{% endhighlight %} - -
-
- A generic square placeholder image with rounded corners -
-
- -{% highlight html %} -
- ... -
-{% endhighlight %} -- cgit v1.2.3