HTML-002版

HTML 2

web 前端

html 超文本标记语言 标签语言 网页的内容层

css 层叠样式层 网页的表现层 渲染和美化页面

js javascript js脚本 网页的行为层 给网页添加动画效果 或者实现和用户的交互

网页：html 代码文档

首页：访问网站时第一个访问到的页面 index.html index.php

网站：若干个网页组成的网络站点

http：超文本传输协议 用于传输网页信息和用户请求的

dns： domain name system 域名系统 用来解析域名

url： 统一资源定位符

html

语法格式

< html>

​ < head>【头部】

​ < meta>< /meta>

​ < title>< /title>【网页标题】

​ < /head>

​ < body>【身体】

​ < /body>

< /html>

head【头部】

1. meat 指定网页的内容，关键字，作者等信息的

定义字符集

定义网页描述信息

定义搜索关键字

定义作者

2. title 网页标题

• < title> …< /title>

3. link 链接外部css样式文件

• < link type=“text/css” rel=“styleSheet” href=“css链接地址”>

4. script 链接外部js文件

• < script src=“js链接地址”>< /script>

5. style 包含本地的css样式文件

• < style type=“text/css”>< /style>

body【身体】

1. < h1>-< h6> 1-6级内容标题标签
2. < hr>水平线标签

• 标签属性：

  align=“”【对齐方式：包括 "left"（左对齐）、"center"（居中对齐）和 "right"（右对齐）。默认值为 "left"】 ；

  color=“”【颜色】 ；

  width=“”【宽度】

3. < br>换行标签

4. < p>段落标签

5. < span>范围标签

6. < ol>/< ul>有序/无序标签

• 使用< li>< /li>

7. < a>超链接标签

• 标签属性：

  name=“”【链接名称，标记超链接的锚点】;

  href=“”【指定链接的目标链接地址URL】（本地网页，网站）;

  target=“_blank”【指定链接在何处打开：

  _blank 表示链接将在新的浏览器窗口或标签页中打开。其他常用的值包括

  _self（默认值，在当前窗口或框架中打开）、

  _parent（在父框架中打开）

  target=”内嵌框架名” 在指定的内嵌框架中打开

  _top（在整个窗口中打开，忽略任何框架）】;

  超链接的分离：

  ​ 普通链接：点击后跳转到指定网页

  ​ 锚链接：

  1.点击后跳转到当前页面的指定位置；

  2.点击后跳转到指定网页的指定位置；

  ​ 功能性链接：

  < a href="javascript:alert('弹窗测试')">弹窗< /a>

8. < img>图片标签

• 标签属性：

  scr=“”【用于指定图片的源文件路径】；

  width=“”【用于指定图片的宽度】；

  height=“”【用于指定图片的高度】；

  border=“”【用于指定图片的边框宽度】；

  alt=“”【用于指定图片的替代文本。当图片无法显示时，浏览器会显示这个替代文本】；

  title=“”【用于指定图片的标题。当用户将鼠标悬停在图片上时，浏览器会显示这个标题】；

9. < table>表格标签

• < tr>行< td>单元格

  border【用于指定表格的边框宽度】；

  width【用于指定表格的宽度】；

  height【用于指定表格的高度】；

  cellspacing【用于指定单元格之间的间距】；

  cellspadding【用于指定单元格内容与单元格边框之间的填充】；

  colspan【跨列】；

  rowspan【跨行】

10. < form>表单标签

• 表单元素

11. < iframe>内嵌框架

12. < div>盒子标签