自学前端(第二天)
接昨天,图像标签的路径:
1.路径之相对路径:以引用文件所在位置作为参考基础,而建立出的目录路径。
简单来说就是图片相对于HTML页面的位置
相对路径分类 符号 说明
同一级路径 图像文件位于HTML文件同一级如<img src="baidu.gif">
下一级路径 / 图像文件位于HTML文件下一级如<img src="images/baidu.gif">
上一级路径 …/ 图像文件位于HTML文件上一级如<img src="../baidu.gif">
2.路径之绝对路径:是指目录下的绝对位置,直接俄到达目标位置,通常是从盘符开始的路径。例如:“D:\web\img\logo.gif"或完整的网络地址"http://www.itcast.cn/images/logo.gif”。
超链接标签
文本或图像
属性 作用
href 用于指定链接的目标url地址,当为标签应用href属性时,它就具有了超链接的功能
target 用于指定链接页面的打开方式,其中_self为默认值,_blank为在新窗口中打开方式
HTML中的注释和特殊字符
1.注释
如果需要在HTML文档中添加一些便于阅读和喱接但又不需要显示在页面中的注释文字,就需要使用注释标签。
HTML中的注释以"<–!“开头,以”–>"结束。
2.特殊字符
在HTML页面中,一些特殊的符号很难或者不方便直接使用,此时我们就可以用下面的字符代替:
表格标签
表格作用:表格主要作用是用来展示数据的。
表格的基本语法:
<table>
<tr>
<td></td>
</tr>
</table>
表头单元格标签:
标签表示HTML表格的表头部分 ``` ``` **表格属性** 后面会通过css设置 **属性名 属性值 描述** align left、center、right 规定表格相对周围元素的对齐方式 border 1或"" 规定表格是否拥有边框,默认为"",表示无边框 cellpadding 像素值 规定单元格边沿与其内容之间的空白,默认1像素 cellspacing 像素值 规定单元格之间的空白,默认2像素 width 像素值或百分比 规定表格的宽度 **表格结构标签** :用于定义表格的头部。内部必须拥有标签。一般都是第一行 :用于定义表格的主体,主要用于放数据本体。姓名 | 性别 | 年龄 |
---|---|---|
刘德华 | 男 | 22 |
张学友 | 男 | 18 |
郭富城 | 男 | 90 |
合并单元格
方式:
- 跨行合并:rowspan=“合并单元格的个数”
- 跨列合并:colspan=“合并单元格的个数”
合并单元格三步骤:
①:先确定是跨行还是跨列合并
②:找到目标单元格,写上合并方式=合并的单元格数量。比如:.
③:删除多余的单元格
列表标签
表格是用来显示数据的,列表是用来布局的。
列表分为三大类:
无序列表,有序列表和自定义列表
1.无序列表
- 标签表示HTML页面中项目的无序列表,一般会以项目符号呈现列表选项,而列表项使用
- 标签定义
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
<li>列表4</li>
<li>列表5</li>
</ul>
2.无序列表
<ol>
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
<li>列表4</li>
<li>列表5</li>
</ol>