css中img默认样式问题

html-css06

css中img默认样式问题,第1张

img默认是个行内元素，比如在img的前面或后面放一些文字，这些文字会与图片排在同一行。因此，当图片的前后存在一些空格或回车换行符时，它们会与图片一起成为同一块行内元素，从而会造成外面的div被撑得比你想象的尺寸要大一些，比如：<div><img src="..."/></div>而如果是这样就不会：<div><img src="..."/></div>如果给img的css添加display:block属性，它就会变成块级元素（它会独占一行），其前后的空格、回车等也会被自动忽略，这样外面的div的尺寸就会保持与img一致。

1、界面中有一个img，但是没有用js来设置它的宽度高度和背景颜色。

2、接着使用jQuery获取到所要设置的div，并且调用css（）方法即可开始设置了。

3、在css方法即可设置，注意，里面有花括号哦，并且属性用双引号引起来。

4、同时设定多个属性，则要用逗号隔开，这样即可多个属性生效。

5、接着打开hbuilder上方浏览器小图标，开始预览。

6、最后观看效果。