Question

<p>标签内<img>的大小如何不受<p>约束？

html/css:
<p><img ... ></p>img
的大小如何不受<p>约束？

有没有可能？
补充：

<p style="min-width: 200px; max-width: 600px;">
<img src="..." style="max-width:100%;"/>
</p>

<p>标签有宽度限制，img需要随浏览器窗口缩小而收缩。
但是，<p>标签内的img不要受到<p>束缚，有可能吗？

Answer 1

在 <img....> 里加上 style, 限制它的大小，例如：
<p><img src="abc.jpg" alt="abc" style="width: 200px; height: 200px"></p>
这是当图片要效果 p 限制的大小时， 如果要图片 (img) 大过 p 的话，建议不要把 img 放在 p 里面。

追问

喔，给img直接设置具体数值的大小是可以超出的约束，但是我给img设置的尺寸是max-width:100%;需要它根据浏览器窗口缩放。可否img即不受约束，又能随浏览器窗口缩放？感谢拉～

追答

直接在 img 里使用 width: 100% 不可以吗？还是会受 p 的影响吗？

追问

设置为width:100%就会受外层约束尺寸了呢。。。。

Answer 2

<img src="..." style="min-width:100%;min-height:100%;"/>里面的百分比改成固定大小的像素即px

Answer 3

里面的img的大小本来也不受p的影响啊，你的css怎么设置的

追问

我给img设置的尺寸是max-width:100%;需要它根据浏览器窗口缩放。
可否img即不受约束，又能随浏览器窗口缩放？感谢拉～

追答

你补充的为什么p的宽度小于图片的宽度，而且还把图片放在p面，你想图片大小根据窗口大小变化的话得用js功能实现，不过我不会JS。
你想要什么效果，能具体说一下吗

追问

感谢回答，我的整个布局是自适应所有浏览器窗口的，在文章中设置的宽度是600px，而CMS输出内容到前端，文字、图片都会被套上标签，但有些图片尺寸不只是600px，所以我想让图片不受的尺寸约束，而给设置宽度600px是为了方便文字阅读。

有没有办法阿，宽度600px，不受宽度600px的约束，而且最好img的属性可以设置max-width:100%;

感谢了～～～

追答

那你给，img设置属性width：auto；试试

追问

img属性width:auto;不行，不会随窗口大小缩放，只有max-width:100%;可以。。。

追答

那不好意思了，估计得用JS控制，当图片大小大于600的时候图片的大小取值了

http://www.codefans.net/jscss/sort/list_10_5.shtml

这是我学习经常看的一个很好的网站，你可以看看

Answer 4

<p style="width:auto; height:auto;"></P>
这样写表示你的img有多大，你的div就有多大:)

追问

不行诶～～img不能随浏览器窗口缩放

追答

你用的是什么浏览器？？（我这边试着可以用）

追问

我的源码是这样：

Safari／Chrome／Firefox／Opear

追答

这是全屏的效果

 

这是缩小后的效果，你看一下是不是你想要的效果

追问

可否贴下代码阿，谢谢。
标签是要设置宽度的，要小于图片宽度。
要在里面
然后最小宽度适应浏览器窗口。

追答

跟你上面写的代码是一样的，如果在你那边不行的话，那就一定是浏览器的问题了 ：）

追问

Safari／Chrome／Firefox／Opear 这4个浏览器测试你的代码，图片都无法随浏览器窗口缩小而收缩

追答

Firefox 最大化的效果：

 

Firefox缩小后的效果：

 

IE、火狐、搜狗在我这边都可以缩放，其他浏览器我这边没有所以就没有测试了（Firefox这边也可以的。。）

Answer 5

<img src="" style="min-width:100%;min-height:100%;" />

试试

追问

不行诶，img不会随浏览器窗口缩放。

标签有宽度限制，img需要能够随浏览器窗口缩放。
但是，标签内的img不要受到束缚，有可能吗？