Front end foundation course 1

前端开胃菜第一课，本节课主要内容为：

• 开发环境介绍
• HTML 入门 Part 1

Development environment

Text editor

文本编辑器主要用来进行一些文本编辑工作，是开发中的主力工具。使用自己熟悉或者顺手的文本编辑器即可。

• Sublime text
• Atom
• Nodepad++
• Vim
• e.t.c

Integrated development environment

集成开发环境，简称IDE，顾名思义即集成了很多功能的一套开发环境。相比于文本编辑器，更重但功能也更全。

• Webstorm
• Aptana
• Brackets

Execution environment

• Chrome
• Firefox + firebug
• Nodejs

HTML

• What is HTML?
• HTML即HyperText Markup Language，超文本标记语言
• 结构化信息
• XHTML
• DHTML
• XML
• The difference between HTML and HTML document.
• What is HTML tag?
• 开标签、闭标签
• 自闭合标签
• A basic structure of the a webpage.
• What is doctype?
• and html element?
• and head element?
• and body element?
• What is HTML attribute?
• 总是在开始标签中
• 以键值对的形式存在
• 常见属性
• class
• id
• style
• title
• data-*

HTML tags part 1

• div 通用块，无明确语义
• span 通用行内，无明确语义
• h1-h6 N级标题，块
• p 段落，块
• a 锚点，行内
• ul 无序列表，块
• ol 有序列表，块
• li 列表项，块

Extended reading

• http://www.google.com 这一串内容究竟是什么?
• 浏览器输入了这一串内容后按回车到网页展示间发生了什么?

Homework

• 配置好自己的发环境
• 一个网页，必须包含主标题、链接列表。其余内容可自由发挥。

Fighting!

2014.11.30