HTML
Hypertext Marked Language,超文本标记语言,后缀名是.htm或.html。
VS一般文本,一个HTML文件不仅包含文本内容,还包含一些Tag(标记),通过Tag可以告知浏览器如何显示HTML文件。
Tag通常成对出现(Opening Tag和Closing Tag),不区分大小写。
基本概念
<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage!
<b>This text is blod</b>
</body>
</html>
<html> 是第一个Tag,告知用户浏览器只是HTML文件的头。
</html>是最后一个Tag,告知浏览器HTML文件到此结束。
<head>和</head>之间的内容,是Head信息,头部信息主要是被浏览器所用,不显示(在用户浏览器里看不到)。但是不代表没有用,可以在Head信息里添加关键词,有助于搜索引擎搜索到该网页。
- 标题title:不显示在HTML网页正文,显示在浏览器窗口最顶端的标题栏。
- 链接link:建立与外部文件的链接。
- 样式style:可以设置网页的内部样式表。
<title>和</title>之间的内容,是文件的标题,是最常用的head信息,在用户浏览器最顶端的标题栏看到。
<body>和</body>之间的内容,是正文。
<b>和</b>之间的文字,用粗体(bold)表示。
HTML元素:用来标记文本,表示文本的内容,如title、body。
HTML元素的属性:属性可以扩展HTML元素的能力,通常由属性名和值成对出现,就像name=“value”,如<body bgcolor=“red”> 表示页面背景色为红色,background属性设置页面背景图片,属性值就是图片路径。属性通常附加给HTML的Opening Tag。
Tag
正文标题:HTML用<h1>到<h6>定义正文标题,从大到小,每个标题自成一段。
<h1>
This is a heading!
</h1>
标题居中:<h1 align=“center”>标题名</h1>
段落划分:<p> </p>
换行:不新建段落的情况下换行,<br>没有Closing Tag
<p>
This
<br>is a para<br>
graph with line breaks
</p>
注释:<!- - This is a comment - ->
补充:HTML文件会自动截去多余的空格,不管连续加多少空格都会被看作一个,一个空行也被看作一个空格。
加横线(分割线):<hr>
常用文本格式Tag:
Tag(成对) | Tag说明 |
---|---|
<b> | 粗体bold |
<i> | 斜体italic |
<del> | 文字当中划线表示删除 |
<ins> | 文字下划线表示插入 |
<sub> | 下标 |
<sup> | 上标 |
<blockquote> | 缩进表示引用 |
<pre> | 保留空格和换行 |
<code> | 表示计算机代码,等宽字体 |
看网页的HTML源代码:鼠标右键–>View Source。
HTML字符实体:要在网页中显示具有特殊含义的字符,如<,就要用到字符实体。字符实体由三部分组成:
- &
- 实体(Entity)名字或者是**#加上实体编号**
- ;
如要显示小于号:<;或者 <;
Entity Name | Entity Number | 显示结果 | 说明 |
---|---|---|---|
|   | 显示一个空格 | |
< | < | < | 小于 |
> | > | > | 大于 |
& | & | & | &符号 |
" | " | “ | 双引号 |
© | © | © | 版权 |
® | ® | ® | 注册商标 |
× | × | × | 乘号 |
÷ | ÷ | ÷ | 除号 |
超链接:<a href=“url”> </a>,href属性表示链接文件的路径。
target属性:
- <a href=“url”_blank> </a>:表示点击链接时,会在一个新的窗口显示。
- <a href=“url” title=“name”> </a>:表示鼠标悬停在链接上时,会显示该超链接的文字注释。
相对路径:
- 同一个目录的文件引用,可直接写引用文件名。
- 不同目录下的文件引用,…/ 表示返回上级目录,…/…/ 表示返回上上级目录,返回两文件的同级目录,再进入引用文件目录,进入文件目录用 / 表示。
绝对路径:指带域名的文件的完整路径,如http://www.baidu.com。
表格:<table> ,表头<th>粗体显示,表格分行,每一行开始要用<tr>,分单元格,每一个单元格开始要用<td>。在缺省情况下,不设置表格边界,默认不显示,同<table border=“0”>。
用colspan属性表示包含多列的单元格,如<th colspan=“2”>。
用rowspan属性表示包含多行的单元格,如<th rowspan=“2”>。
字体大小:<p><font size=“2”> </font></p>。
字体风格:<p><font face=“arial”> </font></p>。
字体颜色:<p><font color="#FF0000"> </font></p>,表示这段字体颜色是红色。