1.排版标签
- 1.标题标签
- 语义:(h:head)作为内容的标题使用,依据重要性递减。(title是文档标题,不一样)
- HTML提供了6个等级的标题。
<h1> </h1> ... ... <h6> </h6>
注意:在企业开发中一般不使用h1标签。
-
2.段落标签
- 语义:(p:paragraph)把文字分割为若干段落,使其有条理的显示出来。
<p> 段落内容 </p>
- 语义:(p:paragraph)把文字分割为若干段落,使其有条理的显示出来。
-
3.水平线标签(单)
- 语义:(hr:horizontal)将段落与段落之间隔开。
<hr />
- 语义:(hr:horizontal)将段落与段落之间隔开。
-
4.换行标签(单)
- 语义:(br:break)强制将文本换行。
<br />
- 语义:(br:break)强制将文本换行。
-
5.div和span标签
- 这两个是没有语义的,是页面布局主要的2个盒子。
- div:division,分割,分区的意思。常用div+css来组合网页。
<div></div>
span 范围;跨度。<span></span>
- div标签,一行只能放一个div。
span标签,一行可以放很多个span。
2.文本格式化标签
- 加粗:
<b></b><strong></strong>
- 斜体:
<i></i><em></em>
- 加删除线:
<s></s><del></del>
- 加下划线:
<u></u><ins></ins>
XHTML推荐使用后一对标签,后一对标签除了前面的功能之外,还有语义的意思。
3.图像标签(单)
- 语义:(img:image)插入图片
- 语法:
<img src=" " alt=" " title=" " />
- 属性:
src="指定图像文件的路径和文件名",必需属性。
title="鼠标悬停时显示的文本"
alt="图片不能显示时的替换文本"
1.属性与属性间用空格分开。属性不分先后。
2.采用 键值对 的格式,key="value"的格式。
4.链接标签
- 语义:(a:anchor)跳转到指定目标。
- 语法:
<a href=" " target=" "> 文本或图像 </a>
- 属性:
href="指定链接目标的地址",必需属性。可以是外部链接,也可以是内部链接。
target="打开指定链接页面的方式",_self在当前页打开,_blank在新的空白页面打开。
注意:
1.当没有确定链接目标时,使用href="#"
来暂定为一个空链接。
2.不仅可创建文本链接,还可以给图像、表格、视频等添加超链接。
-
锚点定位:
- 作用:通过创建锚点链接,使其快速定位到指定位置。
- 步骤:
1.给要跳转的位置标注相应的id名 。<h3 id="two">第二季</h3>
2.使用#id名
来链接到跳转的位置。<a href="#two">点此跳转</a>
-
base标签:
- 作用:统一确定链接打开的方式。
- 语法:
<base target="_blank">
。该语句写在<head></head>
之间
5.注释标签
- 语义:添加一些注释文字。不会显示在网页上,程序不执行该代码。
- 语法:
<!--注释语句 -->
6.路径问题
- 相对路径:以当前网页代码所在的位置为参考点,而建立出的目录路径。
- 同级路径:在同级文件夹中,
<img src="baidu.jpg" />
- 上级路径:在同级文件夹上级,往上一级加
..
,如../../img/bd.jpg
- 下级路径:在同级文件夹下,
<img src="images/baidu.jpg" />
- 同级路径:在同级文件夹中,
- 绝对路径:从盘符开始寻找到的路径,使用的是
\
符号。如C:\Users\itcast\Desktop\baidu.jpg
企业开发中,使用相对路径,不使用绝对路径。
因为使用绝对路径的话,当代码转移到其他电脑上时,有些资源将无法使用了。
7.预格式化文本标签(了解)
- 语义:定义格式化的文本,被定义的文本会保留空格和换行符,按照编写的格式显示。
- 语法:
<pre> 被定义格式化的文本 </pre>
一般不使用,因为不好整体控制。
8.特殊字符
- 作用:一些特殊的符号,在HTML中很难或不方便直接使用,可以用使用代替代码。
- 字符的代码:后面有分号
空格:
<:<
>:>