■ 定义
<img>标签用于定义网页的图片显示
<img>标签是单标签
img代表单词image,意为图像
■ 属性
□ src属性
是<img>标签的必需属性,用于在页面上显示图像
需要使用该属性指定图片的URL地址,即图像文件的路径和文件名
<img src="图片的url">
□ alt属性
alt属性用来为图像定义一串预先自定义的可替换的文本
当浏览器无法载入图像时,会显示替换文本来告知用户相关信息
使用替换文本属性有助于更好的显示信息,提高页面友好度
<img src="图片的url" alt="替换文本">
□ border属性
用于定义图片的边框,默认单位为px(像素)
border属性一般通过css设定,而非标签内设定
<img src="图片的url" alt="替换文本" border="1" /> <!-- 图片的边框是1px-->
□ title属性
用于显示提示文本,鼠标放到图像上会显示title属性值
□ height与width属性
height与width属性用于设置图像的高度与宽度,默认单位为px(像素)
<img src="图片的url" alt="替换文本" width="304" height="228">
注意:
指定图像的高度或宽度是一个很好的习惯
如果图像指定了高度或宽度,页面加载时就会保留指定的尺寸
如果没有指定图片的大小,加载页面时有可能会破坏HTML页面的整体布局
一般高度和宽度设定好其中一个,另一个会自动等比例缩放,如果两个都设定,需精准设定,否则容易导致高度和宽度不协调而失真
■ 注意
加载页面时,要注意插入页面图像的路径,如果不能正确设置图像的位置,浏览器无法加载图片,图像标签就会显示一个破碎的图片
加载图片是需要时间的,如果页面加载的图片过多,会影响响应的速度,所以建议慎多用<img>标签