HTML之img图形标签的显示特点
初学java,学习WEB阶段发现的有趣现象。如有错误请指正,谢谢。
1.图片标签简介
图形标签:<img />(自关闭标签)
属性:
src:图形地址
width:宽度
height:高度
border:边框
align:对齐方式,代表与图片相邻的文本的相对位置(有三个属性值:top middle bottom)
alt:图片的文字说明
2.width和height属性对图片显示的影响
原图:1000*1200px
(1)width和height全部以%显示,例width="50%" height="100%"
不论height属性值为百分之多少,图片会保持原本比例不变,但仅以width的大小显示图片显示尺寸。
上传图片好像看的不直观,描述:显示原比例,显示效果:500*600px。也就是以width比例缩放图片。
以下同理:
(3)width="50%" height="200px",出现拉伸,显示宽度为原图50%,高度只有200px
(4)width="10px" height="200px",按照px值代表的尺寸拉伸原图(原图内容会全部显示)。