CSS固定图片宽度高度

2013-03-25 21:40:13 css 图片宽度高度固定控制代码与方法有哪些？css5为大家介绍CSS图片宽度和图片高度三种情况下固定设置。

DIV CSS图片宽度高度固定控制篇

常常遇到使用CSS对图片进行宽度与高度控制，一般对图片img进行固定控制其宽度高度，为了排版整齐美观，如下图这样的图片排版即需要控制其高和宽度实现。

图片列表需要控制宽度和高度截图

一、对对象内的图片设置固定宽度高度
假如ul li列表型图片排列进行高度和宽度设置，ul父级为“.HTML8”，对图片控制宽度为120px，高度为90px。

设置CSS代码如下：
.HTML8 ul li img{width:120px;height:90px}
这样就控制了“.HTML8”对象内ul li列表对象内img图片宽度120px高度90px

二、通过CSS直接对图片img设置固定宽度和高度
直接对img设置css选择器样式，直接对Img赋予CSS样式。

比如:
<img src="图片地址" class="HTML8" />
这样我们就直接在img标签加入class样式，假如我们还是设置固定宽度和高度分别为120px和90px

对应css代码：
.HTML8{width:120px;height:90px}
或
img.HTML8{width:120px;height:90px}

说明：
Img.HTML8这个表达式，只有img标签使用了“.HTML8”类CSS样式才能生效。

三、直接图片img标签内设置宽度和高度
<img src="图片地址" width="120" height="90" />
这样就直接对img标签假如宽度和高度值，需要注意是不需要跟html单位。