前端学习~

网页的组成

HTML: 内容层—负责页面的内容—文字 链接 图片… CSS：样式层—负责页面的样式—颜色 大小 位置 表现… JavaScript：行为层—负责页面的行为—交互效果 轮播图

页面的内容与样式也有标准，它的标准是由w3c制定的，万维网联盟

HTML的定义

HTML超文本标记语言Hyper Text Markup Language 可以把它简单理解成我们常见的网页 Html是一门编程语言，由大量的标签组成 超文本:文本 图片 超链接 音频 视频… 标记(标签):html的语法标签 <标签>

1.注释

html注释	<!-- -->
css注释	/* */
js注释	//  单行注释 /* */ 多行注释

2.标题标签

h1~h6 标签 ，按照级别逐级递减的。h1级别最高，原则上在一个页面中只能出现一个h1

所有的标题标签都有默认样式，加粗有外间距

特性：属于“块级”，默认自占父级宽度的一整行

3.段落标签

p标签写一行或者一段文字，在页面中常用写大段的内容。

p标签级别要比标题小，不能包裹标题和p本身，同时也不能包裹其他的块级标签

特性：属于“块级”，默认自占父级宽度的一整行

lorem敲tab就会出现一段假文

4.span标签

span没有任何的样式，但它属于“行级”标签，与文字同级别都在一行显示

5.标签的嵌套关系

在html编辑器中，回车也代表一个空格，多个空格多个回车都代表一个空格

行级元素被包裹不用换行包裹

<p><span>￥</span>77</p>

块级元素的包裹书写的时候需要这样的换行包裹样式，可以清晰的分出父子级关系

<div> <p>111</p> </div>

6.div标签

首先div属于“块级”，可以包裹任何的元素以及内容

其次div标签没有任何初始样式

div可以作为布局标签使用，可以完成多种嵌套关系来保证页面显示的，区域性和整体性

7.视频标签

video视频标签需要插入一个视频地址，src属性的值就是视频地址

<video src="视频的地址" loop></video>

在有视频的页面中，右键—检查—找到video标签的src属性，复制src属性中（引号中的）的值

8.路径

可以在值中添加路径的常用属性

src引入属性，video，img，script等

href引用属性，a，link等

相对路径写法

当前的文件	就是相对的文件源
找同级	./
找同级的下一级	./同级目录/xx
找上一级	../

9.图片标签

img图片是单标签，必须依靠src属性引入图片的路径。

alt是图片描述属性，可以不写内容

10.超链接

a标签是超链接标签，默认动作就跳转

a属于“行级”标签

href属性中需要写将要跳转的地址，暂时没有地址，可以先填写#代表跳转到当前

<a href="https://www.baidu.com/">点击我去百度</a> <a href="./1.html">我想看我写的1.html</a> <a href="#">代表跳转到当前页</a>