HTML学习笔记(13-24)

 HTML学习笔记(13-24)

        （十三）网页中引入图片
			1、网页中引入图片需使用img标签。
				<img src="图片路径"/>
				实例：<img src="image/favicon.jpg"/>
			2、src属性用来指定图片所在文件的路径，图片路径可以是相对路径，也可以绝对路径。
			3、当图片路径不正确无法显示，可以用alt="文字提示信息"。
				输入方法:img+Tab键
				<img src="https://www.51zxw.net/6380.jpg" alt="无法显示，请检查图片路径" />
				alt属性是当图片无法正常显示时替换文本，路径不对，网速过慢，浏览器版本过低，图片格式不对，都可能造成图片无法显示。
			4、width height属性
				a、width属性，设置图片的宽度。height属性，设置图片的高度。
				b、如果不设置，图片会按原始尺寸显示。
				c、如果只设置其中一个属性，另一个会根据已设置的属性等比例缩放。
				语法实例：	<img src="image/favicon.jpg" width="300" height="200">
				d、宽度与高度的设置，单位默认是象素，也可以设置为百分比。
		（十四）音频的引入
				IE8之前的浏览器不支持。
				1 、audio标签在网页中引入音频，使用<audio src="音频路径"></audio>
				2、src属性，指定音频文件路径，必须要有。
				3、controls属性，显示播放控件。
				4、autoplay属性，音频准备就绪后马上手播放。
				5、loop属性，音频播放结束后重新播放。				
				controls autoplay 属性名loop与属性值一样，可以只写属性名。
				6、muted属性：音频输出时静音。 				
				preload页面开始加载时就加载音频，并预备播放。如果使用了autoplay属性，preload属性不会失效。
		       实例： <audio src="download/DJ我是不是你最疼爱的人.mp3" controls loop autoplay="autoplay">你的浏览器不支持音频播放</audio>
		 （十五）视频的引入
				IE8之前的浏览器不支持。
				1 、video标签在网页中引入音频，使用<video src="视频路径"></video>
				2、src属性，指定视频文件路径，必须要有。
				3、controls属性，显示播放控件。
				4、autoplay属性，视频准备就绪后马上手播放。
				5、loop属性，视频播放结束后重新播放。				
				controls autoplay 属性名loop与属性值一样，可以只写属性名。
				6、muted属性：视频输出时静音。 	
				以上同音频的属性是一样的。
				
				*7、poster属性：用于在视频加载时或者用户在点击播放前显示的图片。
				 它的属性值就是你需要加载图片的路径。这个图片通常用于广告。				 
				preload页面开始加载时就加载视频，并预备播放。如果使用了autoplay属性，preload属性不会失效。    
				
				*width height属性
				a、width属性，设置视频窗口的宽度。height属性，设置视频窗口的高度。
				b、如果不设置，视频会按原始尺寸显示。
				c、如果只设置其中一个属性，另一个会根据已设置的属性等比例缩放。
				例:<video src="download/1d.mp4" height="400" controls poster="image/favicon.jpg"></video>
			
			 （十六）定义媒质资源
			 	source标签：用来为video和audio标签，定义媒介资源。
			 	src属性：定义资源的路径。
				type属性用来定义媒介资源的类型。
				浏览器会自动从上往下找能识别的资源类型。
				<video width="200" height="300" controls>
					<source src="download/1d.mp4" type="video/mp4"></source>
					<source src="myvideo.ogv" type="video/ogg"></source>
				当前浏览器不支持 video直接播放，点击这里下载视频： <a href="download/1d.mp4">下载视频</a>
				</video>
				
			（十七）标题元素
				1、h1—h6标签可以用来定义标题。
				2、标题标签有强调作用，有确切的语言义，h1—h6按重要性递减速。
				3、h1定义最大的标题,h6定义最小的标题。
				4、h1标记在同一个页面只能使用一次h1标记。h2—h6可以多次使用。
				5、不要利用h标签来改变文字大小，使用CSS更方便更美观。
				
			（十八）段落元素
				1、浏览器忽略代码中的格式，多个空格符、回车符、制表符会解析成一个空格（非常重要）。
				2、P标签用来标记一个段落，是常见的一个标记。
				3、P标签会独占一行。
				
				扩展知识：
				text-align: center;  //文字居中显示
				text-indent:2em ;	 //文字缩进2个字符
				
			（十九）斜体标签
				1、i标签：单纯显示斜体文本效果。
				2、em标签：显示斜体文本效果。另有强调作用。
				如果仅需要单纯的斜体，强调太多，有些重要的语句会被漏掉，不要滥用强调。
				
			（二十）粗体标签
				1、b标签：单纯显示加粗的文本效果。
				2、strong标签：显示加粗文本效果。另有强调作用。比em标签强调作用更强。
				如果仅需要单纯的粗体，请使用b标签，不要使用strong标签，不要滥用强调。	
			（二十一）换行标签
				换行标签<br />：
				1、在不另起一段的情况下强制换行。
				2、一次<br />标签表示换一行，连续多个标签可以实现多次换行。
				3、br标签不仅对文本可以换行，其它元素也可以用br标签强制换行。
				
			（二十二）水平分隔线
				水平分隔线hr单标签：
				1、在视觉上将文档分隔成几个部分，使得文档结档清晰，层次分明。
				2、hr标签可以在网页上画出一条水平分隔线。
				3、hr标签的所有属性都不赞成使用，不要试图使用属性改变标签的样式。
				4、 应该使用css来修改hr标签的样式。
			（二十三）span标签与字符实体。
				span标签：
				1、没有任何样式，是为了给文本增加额外的结构。
				2、使用css给span元素中的内容添加丰富的样式。
				3、span标签是使用最多的文本标签。
				字符实体：
				html中预留字符必须替换成字符实体，才能被浏览器正常识别。
				常风的字符实体：
				小于号：&lt;
				大于号：&gt;
				空格：&nbsp;
				其它的可以百度搜索，不用死记硬背。
			（二十四）其它的文体标签	
				ins标签：定义下划线；
				del标签：定义删除线；
				sup标签：定议上标文体，高度为当前文本的一半；
				sub标签：定议下标文体，高度为当前文本的一半；
				mark标签：为文本添加黄色背景，突出显示文本。
				以上标签仅作了解，基本不用。css可以很好实行相应的功能。