学习内容:
- HTML常用标签(中)
- HTML中的注释和特殊字符
学习产出:
HTML常用标签(中):
超链接标签:
1)链接的语法格式
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a> |
两个属性的作用如下:
属性 | 作用 |
---|---|
href | 用于指定链接目标的url地址,(必须属性) 当为标签应用href属性时,它就具有了超链接的功能 |
target | 用于指定链接页面的打开方式,其中_self为默认值,_blank为在新窗口中打开方式。 |
2)链接分类:
外部链接:例如< a href= "https://ys.mihoyo.com/">原神</a>
内部链接:网站内部页面之间的相互链接直接链接内部页面名称即可,例如< a href= "index.html">首页</a>
空链接:如果当时没有确定链接目标时,<a href="#">首页</a>
下载链接:如果href里面地址是一个文件或者压缩包,会下载这个文件
网页元素链接::在网页中的各种网页元素,如文本、图像、表格、音频、 视频等都可以添加超链接
锚点链接:点我们点击链接可以快速定位到页面中的某个位置
●在链接文本的href属性中,设置属值为#名字的形式,如<ahref= "#yuanshen">原神</a>
●找到目标位置标签,里面添加一个id属性=刚才的名字,如:<h3 id="yuanshen" >原神启动</h3>
表格标签:
1)基本语法
<table> <tr> <td>单元格内的文字</td> … </tr> … </table> |
<table> </table> 是用于定义表格的标签
<tr> </tr> 标签用于定义表格中的行,必须嵌套在<table> </table> 标签中
<td> </td>用于定义表格中的单元格,必须嵌套在<tr> </tr>标签中
字母td指表格数据( table data),即数据单元格的内容
2)表格属性
不常用,一般通过CSS来设置
属性名 | 属性值 | 描述 |
---|---|---|
align | left、 center、 right | 规定表格相对周围元素的对齐方式 |
border | 1或" | 规定表格单元是否拥有边框,默认为"",表示没有边框 |
cellpadding | 像素值 | 规定单元边沿与其内容之间的空白,默认1像素 |
cellspacing | 像素值 | 规定单元格之间的空白,默认2像素 |
width | 像素值或百分比 | 规定表格的宽度 |
3)表头单元格标签
一般表头单元格位于表格的第一 行或第一 列,表头单元格里面的文本内容加粗居中显示
<th>标签表示HTML表格的表头部分
4)表格结构标签
<thead> </thead> :用于定义表格的头部;<thead> 内部必须拥有<tr>标签,一般是位于第一 行,与表头单元格标签区别
<tbody> </tbody> :用于定义表格的主体,主要用于放数据本体
以上标签都是放在<table> </table>标签中
5)合并单元格
●跨列合并: colspan="合并单元格的个数"
●跨列合并: colspan="合并单元格的个数"
目标单元格:(写合并代码)
●跨行:最上侧单元格为目标单元格,写合并代码
●跨列:最左侧单元格为目标单元格,写合并代码
HTML中的注释和特殊字符:
1)注释:
在HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字,就需要使用注释标签,HTML中的注释以<!--"开头,以"-->”结束
<!--注释语句--> 快捷键:ctrl + / |
2)特殊字符:
在HTML页面中,一些特殊的符号很难或者不方便直接使用,此时我们就可以使用下面的字符来替代
描述 | 字符的代码 |
---|---|
空格符 | |
小于号 | < |
大于号 | > |
和号 | & |
人民币 | ¥ |
版权 | &cop;y |
注册商标 | ® |
摄氏度 | ° |
正负号 | &piusm;n |
乘号 | × |
除号 | ÷ |
平方 | ² |
立方 | ³ |