web前端开发：第一阶段html+css基础知识.doc

1 HTML入门
1.1 安装工具
1) 编辑器 —— Sublime Text
安装插件：
按Ctrl+`（Esc下方的按钮）调出console ；复制：import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp) if notos.path.exists(ipp) else None;open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen(' ','%20')).read())到代码底部命令行中 ；按回车键执行；重启Sublime Text；浏览器 —— Chrome、Safari 、Firefox 、360浏览器、遨游等。
2) 图形工具 —— PhotoShop
3) 版本管理工具 —— TortoiseSVN
SVN是什么？意义何在？
SVN是版本管理工具。当大家都在共同开发一个项目的时候，可以有效避免协作开发中的代码冲突问题；历史版本的保存也使得项目变得有据可查，当项目需要回滚到之前版本的时候，可以轻松的找到代码。此外一些开源项目也在使用SVN，这是一个使协同开发和版本维护变得方便的工具。
4) 环境集成工具 —— WAMP
1.2 创建项目文件夹（名字自起）
(1) 创建html文件 （常起名 index.html，一个项目有多个html文件） 创建项目文件夹
(2) 创建css文件夹（用来放css层叠样式文件）
(3) 创建images文件夹（用来放网页中需要的图片）
1.3 HTML介绍
HTML是用来制作网页的标记语言
HTML是Hypertext Markup Language的英文缩写,即超文本标记语言。
HTML语言是一种标记语言,不需要编译,直接由浏览器执行。
HTML文件是一个文本文件,包含了一些HTML元素,标签等。
HTML文件必须使用html或htm为文件名后缀。
HTML是大小写不敏感的,HTML与html是一样的。
HTML是由W3C的维护的。
1.4 前端介绍
前端页面=结构html+样式css+行为js
2 HTML结构
2.1 HTML结构
头部head+身体body
(1) head
标签用于定义文档的头部，它是所有头部元素的容器。
中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
文档的头部描述了文档的各种属性和信息，包括文档的标题、 编码格式等；绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
定义文档的标题，它是 hea</p><p style='padding:5px 0px;'>5、d 部分中唯一必需的元素。
<meta charset="UTF-8"> —— 声明文档编码格式 为 UTF-8
<title> 文档标题 ——— 网页名称
—— 链接样式表
css样式 —— css样式
定义客户端脚本

元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。
(2) body
元素定义文档的主体。
元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。）
网页需展示的内容需嵌套在标签中。
2.2 HTML标签
HTML标签是HTML语言中最基本的单位，也是最重要的一部分。浏览器以某种方式显示相应的标签样式。
(1) HTML标签特点
ü 由尖括号包围的关键词，比如 。
ü 通常是成对出现的，比如 签。
ü 开始和结束标签也被称为开放标签和闭合标签。
ü 也有单独呈现的标签，如：等。
ü 一般成对出现的标签，其内容在两个标签中间。单独呈现的标签，则在标签属性中赋值。如dd>:描述列表中的项目
ü 粗体文本。
ü :强调文本
ü :斜体的文本
ü : 重要的文本。
ü :定义变量
ü :引用。如引用的书籍或杂志的标题。
ü