标签：
一、网页组成
- HTML：网页的具体内容和结构，由N个标签（节点，元素，标记）组成
- CSS：网页的样式，美化网页
- JavaScript：网页的交互效果，比如用户鼠标的点击事件作出响应
二、常见的HTML标签
- 标题：h1、h2、h3、h4........
- 段落：p
<p style = "color: red; background: #00f">你好！好你妹！</p>
- 换行：br
- 容器：div、span（用来容纳其他标签）
- 表格：table、tr、td
- 列表：ul、ol、li
- 图片：img
<img src="q1.jpg">
<input typr="button" value="这是一个按钮">
<a href="http://baidu.com" target="_blank" style="font-size: 20px;">
<html>
<head>
<meta charset="utf-8"> /*使用utf-8编码，不然看到的是乱码*/
<link rel="shortcut icon" href="zheshitubiao.ico"> /*网页标题旁边的图标*/
<title>百度一下，你就知道</title> /*网页的标题*/
</head>
<body>
</body>
</html>
三、CSS（Cascading Style Sheets）: 层叠样式表，用来控制HTML标签的样式
1>CSS的三种书写形式：
- 行内样式：（内联样式）直接在标签的style属性中书写
<body style="color: red;">
<style>
body {
color: red;
}
</style>
- 外部样式：在单独的CSS文件中书写，然后在网页中用link标签引用
<link rel="stylesheet" href="index.css">
2>CSS两大核心：选择器+属性
选择器：选择对应的标签，加样式
选择器分类：
div {
color: red;
}
.high {
color: red;
}
<p class="high">第一行</p>
<p>第二行</p>
#first {
color: red;
}
<p id="first">第一段文字</p>
div, .high {
color: red;
}
<p class="high">第一段文字</p> /*红色*/
<p>第二段文字</p>
<div class="high">div1</div> /*红色*/
<div>div2</div> /*红色*/
div.high {
color: red;
}
<p class="high">第一段文字</p>
<div class="high">div1</div> /*只有这一行是红色的*/
<div>div2</div>
div p {
color: red;
}
<div>
<p>div里面的p</p> /*红色*/
<span>
<p>div里面的span里面的p</p> /*红色*/
</span>
</div>
<p>外面的p</p>
div > p {
color: red;
}
<div>
<p>div里面的p</p> /*红色*/
<span>
<p>div里面的span里面的p</p>
</span>
</div>
<p>外面的p</p>
div+ p {
color: red;
}
<div>
<p>div里面的p</p>
<span>
<p>div里面的span里面的p</p>
</span>
</div>
<p>与div相邻的p</p> /*红色*/
<p>与p相邻的p</p>
重拾HTML（一）
标签：
原文地址：http://www.cnblogs.com/10-19-92/p/5353331.html
