html: HyperText Markup Language (超文本标记语言)
Hypertext(超文本) means "text with links in it."
A markup language(标记语言) is a programming language used to make text do more than just sit on a page: it can turn text into images, links, tables, lists, and much more.
HTML 可以看作每个网页的骨架,组成了网页的结构。
CSS: Cascading Style Sheets(级联样式表)
CSS 让网页更加漂亮,比如它可以给网页设置皮肤。
HTML 基本结构
// 总是在第一行,告诉浏览器在读什么语言
// HTML 文档的开始部分
</html> // HTML 文档的结束部分
基本术语
两个尖括号 <xxx> 括起来的叫做 tags(标签).
Tags 总是成对出现: 一个 opening tag(开口标签) and a closing tag(闭合标签).
Example of opening tag: <html>
Example of closing tag: </html>
可以把标签看作是括号匹配的形式,每当你有一个开口标签,一定要有一个对应的闭合标签。标签也可以嵌套,应该按正确的形式进行嵌套:一个闭合标签应和它左边最近的一个开口标签匹配。例如,
合法的:<first tag><second tag> Some text! </second tag></first tag>
不合法的:<first tag><second tag>Some text!</first tag></second tag>
<strong> </strong> 粗体字
head(头部)
整个 html 文件的内容都在 <html> </html> 之内
There are always two parts to the file: the head and body
a. It has an opening and a closing tag.
head 有开口标签和闭合标签
b. The head includes important information about the webpage, such as its title.
更多精彩内容:http://www.bianceng.cn/web/Html/
head 包含网页的重要信息,比如标题
c. The title is the words we see in the tab (for example, the title of this page is"Introduction to HTML").
标题就是我们在 tab 栏看到的字
Body(主体)内的段落
我们把一对标签和标签里的内容叫做 element(元素)
element = <opening tag> + content + <closing tag>
在 <body> 标签里的内容是在网页中的真正的可视部分
<html>
<head></head>
<body></body>
</html>
1. 在 title 标签内,是你页面的名字,可以是任何东西。
2. 在 title 标签下,是 body 标签
3. 在 body 标签内,我们可以创建段落,<p> content </p>
Paragraphs and headings(段落和标题)
我们已经学习了:
1. 创建一个有标签的 html 文件
2. 在 <head> 中创建标题(title)
3. 在 <body> 中创建段落(p)
接下来,我们还可以给我们的段落创建标题,<p> 是最大的标题
HTML 给了我们很多种标题尺寸,<p> 是最大的,<h6> 是最小的标题
<p> - The CEO
<h2> - VP of Fancy Towne
<h3> - Director of Some Stuff
<h4> - Middle management
<h5> - Lowly assistant
<h6> - Gets coffee for everyone else
Mid-lesson breather 中途小结
1. HTML 是用来给网页做结构的
2. 我们用浏览器来打开 html 文件,并且浏览器展示文件内容给我们
3. html 有一个 <head> 和一个 <body> 标签
4. 在 head 中,我们有 <title> 文档标题,用这个来表示页面的名字
5. 怎样制作段落 (p) 和段落的标题(h1,h2...h6)
Adding images(添加图片)
来源: http://www.bianceng.cn/web/Html/201411/46551.htm