我有这段代码,但图片保持原始大小。
<div style="margin: 10px; align: center;">
<img height="40%" src="data:image/jpeg;base64,{{ photo }}" />
</div>
如果我删除了div,那么它会完美地调整大小。
即使在div中,我还需要做些什么才能正确调整大小?
由于
答案 0 :(得分:2)
图像假设占用div大小的40%,但你的div是空的并且没有指定大小,这意味着默认情况下你的div的大小将设置为auto
(意味着它将根据内容调整大小)。这就是为什么图像不会调整大小,请执行以下操作:
<div style="margin: 10px; align: center; width:500px; height:500px;">
<img height="40%" src="data:image/jpeg;base64,{{ photo }}" />
</div>
以下是演示:
<div style="margin: 10px; align: center; width:500px; height:500px;">
<img height="40%" src="http://www.cypresspa.com/images/img/home-1-bg-3.jpg" />
</div>