如何使图像适合窗口屏幕,(哪些图像不在html文件中)

时间:2015-09-03 17:07:48

标签: html css

我知道我不应该在这里发布链接,因为它对将来的使用没有用,但我不知道怎么问,我没有上传图片的声誉。你们都请原谅我。 我正在医生的网站上工作,这是耐心的照片。

http://www.drkhalilmd.com/images/photogallery-Breast-Aug/patient01/image-01-big.jpg

我正在尝试将此图像调整到移动宽度,它超出了浏览器的宽度并且像这样

http://mobiletest.me/iphone_5_emulator/?u=http://www.drkhalilmd.com/images/photogallery-Breast-Aug/patient01/image-01-big.jpg 有什么帮助吗?

1 个答案:

答案 0 :(得分:1)

只需在图像中添加一个类标记,如下所示:

<img class="boobPic" src="http://www.drkhalilmd.com/images/photogallery-Breast-Aug/patient01/image-01-big.jpg" />

然后将此添加到您的css:

img.boobPic {
    max-width: 100%;
    height: auto;
}

由于您的图片位于iframe中,因此以下内容也适用。但是,它也会将属性应用于页面上的所有其他图像:

img {
    max-width: 100%;
    height: auto;
}