前端学习之常用标签

常用标签

图像标签

单标签，格式为 <>里写img src=" " / ,src指定图像文件的路径或者是文件名，具体填什么还要看后面的绝对路径还是相对路径

图像标签还有很多别的属性
例如
alt 作用当图片不能正常显示的时候显示文本的属性

例子为<>中写 img src=" " alt=" " /

title 作用是当鼠标放在图像上的时候，显示的文本

例子为<>中写 img src=" " title=" "/

当然还有width height，这两个是修改图像的宽度和高度。

还有一个border的属性，设置图像边框的粗细，一般都是后面css来设定，此次只是了解。

总结一下，图像标签中src属性必须得写，图像标签可以拥有多个属性，属性不分顺序，属性跟属性之间空格分开，即属性要采取键值对的方式

路径

在学习路径我们要知道两个概念，
1.目录文件夹
2.根目录

目录文件夹就是个普通文件夹，只不过这个文件夹里存放的是你完成任务需要的东西
根目录就是打开这个目录文件夹 所显示的内容就是根目录，即第一层

相对路径
是指以引用文件所在位置的进行参考，进行路径表述
三种情况：1.同级路径 即所需文件和html文件处于同一层
2.下一层路径 即所需文件位于html文件的下一层，即所需文件在与html文件同一层的文件夹中

格式为 <> 中 img src =" 所在文件夹/ 所需文件 "

3.上一层路径 即所需文件位于html文件的上一层，即所需文件在与html文件上一层的文件夹中

格式为<> 中 img src ="…/所需文件"

绝对路径
是指目录下的绝对路径，即在电脑中的位置，即在C盘还是D盘

例如C:\Users…

但是每个人的电脑里的内容是不一样的 所以在日常生活中不用这个格式，注意两个路径的反斜杠的方向

超链接
语法格式
<>中a href=" " target=" " <>/a双标签
一对儿a标签
href是我们要连接的位置

当href里的链接是内部链接时，直接写文件名
当链接是外部链接时，要用http:// 网站

target是我们打开的方式，是当前页面，还是新页面

当target是_self时就是在当前页面
当target是_blank时就是在另外的一个窗口
当不确定链接什么的时候得时候href可以用#来填充

并且当href里面地址是一个文件或者是压缩包得时候，他会下载，当然图片什么得元素都能添加超链接

锚点链接
作用:点击链接，可以快速定位到页面的位置
方法就是 在链接文本的href属性的前面加上一个#

例如href="#a"
相当于给链接取个别名

然后在自己需要定位的位置的标签里加上一个id属性，属性值就是href里面的别名

注释标签
<>中!-- – 快捷键为ctrl + /
特殊字符
空格 &nbsp 有多少这个字符代码就有多少空格

例如 你&nbsp；&nbsp；好

其他如图所示

表格标签
表格用于显示展示数据
一个双标签<>table 表示表格
这个table标签里包括一个行标签 tr
行标签里包括td 也就是每一行的每个单元的标签
这样以此类推就能得出一个表格

表头标签 <>th 通常用于表格的第一行 作用是让文字加粗居中。

并且通常使用<>thead来包括一个表格的头一行
<>tbody来包括表格的其他部分

当然我们可以在table标签中添加表格的属性例如居中，显示边，调整空格大小但是这些在html中不太用到，要到后面我更新css来说明

合并单元格
基于表格的合并单元格
rowspan 跨行合并
colspan 跨列合并

例子 <>td colspan=“2” /td

进行了代码后 再把多余的单元格的代码删除

列表标签

有序列表
一对<>ul标签中包含很多对 li 标签
并且ul中只能放 li 标签放别的标签是错误的
对于li的理解 li 相当于容器，里面可以存放各种东西

无序列表
一对<>ol中包含很多对 li 标签
同有序列表

自定义列表
一个 dl 标签中包含 dt 和 dd 标签
dt为名词 dd为名字的解释

表单标签
<>input表单元素中type属性