HTML学习之图片标签学习

最新推荐文章于 2024-03-31 09:22:00 发布

playboy-jordan

最新推荐文章于 2024-03-31 09:22:00 发布

阅读量247

点赞数

分类专栏： # HTML教程文章标签： html css js html5

本文链接：https://blog.csdn.net/weixin_44853669/article/details/106698222

版权

HTML教程专栏收录该内容

11 篇文章 0 订阅

订阅专栏

<html>
	<head>
		<title>图片标签学习</title>
		<meta charset="UTF-8"/>
	</head>
	<body>
		<h3>图片标签学习:</h3>
		<pre>
	图片标签:
		img
			src:图片路径
				本地资源路径:一般本地图片资源使用相对路径即可
				网络资源路径:图片资源的URL地址
			width:设置图片的宽度,如果是单独设置,则再图片保证不失真的情况下自动缩小或者放大
				  单位可以是px也可以是百分比
			height:设置图片的高度,如果是单独设置,则再图片保证不失真的情况下自动缩小或者放大
				  单位可以是px也可以是百分比
			title:图片标题,鼠标放在图片上的时候会显示
			alt:图片加载失败后的提示语
			注意:图片是不会自动换行的(行内元素)
		注意
		相对路径:从当前文件出发查找另一个文件所经过的路径
		绝对路径:从根盘符出发所查找文件的路径
		</pre>
		
		<hr />
		<!--使用本地资源:图片位于本地电脑中-->
		<img src="img/1.jpg"  height="200px"/>
		<img src="img/2.jpg" height="200px"/>
		<img src="img2/2.jpg"  height="200px" title="这是一个优美的图片" alt="这是一个优美的图片"/>
		<hr />
		<!--使用网络资源:-->
<img src="http://01.minipic.eastday.com/20170523/20170523175755
_c29d808f4357be2b791c11c114d6944a_6.jpeg" 
		width="200px"/>
	</body>
</html>
<!--
	图片标签:
		img
			src:图片路径
				本地资源路径:一般本地图片资源使用相对路径即可
				网络资源路径:图片资源的URL地址
			width:设置图片的宽度,如果是单独设置,则再图片保证不失真的情况下自动缩小或者放大
				  单位可以是px也可以是百分比
			height:设置图片的高度,如果是单独设置,则再图片保证不失真的情况下自动缩小或者放大
				  单位可以是px也可以是百分比
			title:图片标题,鼠标放在图片上的时候会显示
			alt:图片加载失败后的提示语
			注意:图片是不会自动换行的(行内元素)
	注意
		相对路径:从当前文件出发查找另一个文件所经过的路径
		绝对路径:从根盘符出发所查找文件的路径
-->