以下是我对Web前端-Html部分的笔记，因为博主也是初学Web前端，有很多东西都还停留在表层的理解，如果我的博客有任何错误，请及时评论或者私信我，我会及时更改。也欢迎同样初学Web-前端的你愿意关注我的博客，我会把我每周的学习内容进行整理和上传，方便大家沟通和交流学习经验。
一、常用基础标签
1、h标签(Headline)(双标签)
-
作用
用于给文本添加标题语义 -
格式
<h1>xxx</h1> -
说明
-
H标签是用来给文本添加标题语义的, 而不是用来修改文本的样式的
-
H标签一共有6个, 从H1~H6, 最多就只能到6, 超过6则无效
-
被H系列标签包裹的内容会独占一行
-
在H系列的标签中, H1最大, H6最小
-
在企业开发中, 一定要慎用H系列的标签, 特别是H1标签. 在企业开发中一般情况下一个界面中只能出现一个H1标签,
-
H1默认样式:margin:8px;
-
H2标签尽量在页面中不要超过5个
-
针对搜索引擎来说是告诉了不同标签下代表不同的重要级别内容。如果你在一个网页中使用的1-2中H型标签中都含有一个相同关键字，搜索引擎也会格外注重你所注重关键字与内容，但切记别乱用。
-
2、br标签(Break)(单标签)
-
作用
让内容换行 -
格式aaaaa<br/>bbbbb
-
说明
br的意思是不另起一个段落进行换行，如果需要另起了一个段落，则应该使用p标签来做。
3、p标签(Paragraph)(双标签)
-
作用
告诉浏览器哪些文字是一个段落 -
格式
<p>xxxxxxxx</p> -
说明：
在浏览器中会单独占一行且自动换行。
-
p标签与br标签的区别
1、相同之处
br和p都是有换行的属性及意思
2、不同之处
1、 <br/>是单标签 <p></p>是双标签
2、br标签是小换行提行，p标签是大换行（分段）作用
4、 a标签(anchor)(单标签)
-
作用
用于从一个页面链接到另一个页面 -
格式
<a href="http://www.baidu.com">百度一下就知道</a> -
说明：
-
在a标签之间一定要写上文字，如果没有，那么在页面上找不到这个标签。
-
a标签也叫做超级链接或超链接
-
-
属性
-
href(hypertext reference)
-
指定跳转的目标地址
-
已经写好的链接文本路劲和链接到页面中的一个锚点（id或name来定义的，这时浏览器地址后面会加上其id或name的值）
-
-
target告诉浏览器是否保留原始界面
-
_blank： 在新窗口中打开被链接文档。
-
_self： 默认。在相同的框架中打开被链接文档。
-
_parent： 在父框架集中打开被链接文档。
-
_top： 在整个窗口中打开被链接文档。
-
-
title悬停文本（介绍这个链接，只有在鼠标移动到超链接上时才会显示）
-
-
其他
-
base标签和a标签结合使用
-
如果每个a标签都想在新页面中打开,那么逐个设置a标签的target属性比较麻烦, 这时我们可以使用base和a标签结合的方式,一次性设置有a标签都在新页面中打开。
-
格式：
<head>
<base target="_blank" />
</head> -
说明：
-
base必须嵌套在head标签里面。
-
如果标签上指定了target，base中也指定了target，那么会按照标签上指定的来执行。
-
-
-
假链接(本质是跳转到当前页面)
-
不跳转的假链接
<a href="#">小电影</a>
或者 <a href="javascript:">小电影</a> -
跳转到当前页面指定位置(锚点链接)
<a href="#location">跳转到指定位置</a>
在页面的指定位置给任意标签添加一个id属性 例如:<p id="location">这个是目标</p>
-
-
跳转到指定页面的指定位置(注意和上边当前页面跳转进行区分)
格式: <a href="锚点链接.html#location">跳转到指定位置</a>
只需要在 锚点链接.html页面添加一个id位置即可
-
5、img标签(image)(单标签)
-
作用
在网页上插入一张图片 -
格式
<img src="图片路径" /> -
图片路径：图片路径分为两种
-
网络路径：直接是其他服务器的图片地址
-
本地路径：本地操作系统的路径
-
一种是绝对路径、一种是相对路径(相对于该HTML页面文件所在路径)。在企业级开发中没有人使用绝对路径，因为绝对路径不易于移植。
-
-
-
常用属性：
-
src(source) 告诉浏览器需要插入的图片路径, 以便于浏览器到该路径下找到需要插入的图片
-
alt(alternate) 规定图像的替代文本，只有在src指定的路径下找不到图片，才会显示alt指定的文本
-
title悬停文本(介绍这张图片, 只有在鼠标移动到图片上时才会显示)
-
height设置图片显示的高度
-
width设置图片显示的宽度
如果想让图片等比拉伸, 只写高度或者宽度即可，两个都写会造成图片比例失衡。
-
6、nobr标签(双标签)
-
作用
强制不换行标签-禁止内容换行 -
格式
<nobr>xxx</nobr> -
说明：
-
不换行内容放入\ 与\ 之间即可
-
如不遇到br换行标签，内容在一行显示完，如遇到br换行标签，内容将在加br换行自动换行
-
7、span 标签(双标签)
-
作用
没有实际语义，但是有时比较有用，它的存在纯粹是为了应用样式，
给一段内容加上 <span></span> 标记可以通过在span上定义样式来设定其内容的样式