You can read more about the Less :extend
pseudo class from the Using extend to merge selectors recipe of Chapter 5, Extending and Referencing. In this recipe, you will see how to use this pseudo class to make all the images in your Bootstrap project responsive by default.
Download the source version of Bootstrap from http://getbootstrap.com/getting-started/#download.
In Twitter's Bootstrap version 2, images (the img
tag) were responsive by default. In Bootstrap version 3, an image can only be made responsive by adding the .img-responsive
parameter to the img
tag. You can use the following steps to make your images responsive by default again:
Install the source version of Bootstrap as described in the Downloading and installing Bootstrap recipe of this chapter.
Open the
less/bootstrap.less
file and add the following Less code at the end of this file:img { &:extend(.img-responsive); }
Recompile Bootstrap by running the following...