html+css+js三剑客

前端三兄弟， html、css和js，我们可以用人来帮助我们理解， html帮我们构建静态页面（它相当于人的骨架），但光是骨架特别难看，所以我们需要 css来美化页面（相当于人的皮），但这样的做出来的页面是静态的，所以我们需要 js来实现动态和交互（相当于人的灵魂，使人变得有灵性）。

html

HTML 不是一门编程语言，而是一种用来告知浏览器如何组织页面的标记语言。它由一系列的元素（elements）组成，这些元素可以用来包围不同部分的内容，使其以某种方式呈现或者工作。 一对标签（ tags）可以为一段文字或者一张图片添加超链接，将文字设置为斜体，改变字号，等等。

元素(Element)

<p>我爱我的祖国</p>

• 开始标签：包含元素的名称（本例为 p），被左、右角括号所包围。表示元素从这里开始或者开始起作用。
• 与开始标签相似，只是其在元素名之前包含了一个斜杠。这表示着元素的结尾。 元素的内容，本例中就是所输入的文本本身。
• 开始标签、结束标签与内容相结合，便是一个完整的元素。

HTML 中事先规定了一些元素，每种元素都有其语义(semantic)，这里的 p 是段落(paragraph)的语义。

嵌套元素(Nesting Element)

可以把元素放到其它元素之中——这被称作嵌套。

<p>我爱我的<strong>祖国</strong></p>

  这里使用<strong></strong>标签，来强调 祖国 这一内容。

块级(block)元素和内联(inline)元素

<p>第一段</p>
<p>第二段</p>
<p>第三段</p>
<p>第四段</p>

<strong>第一句话</strong>
<strong>第二句话</strong>
<strong>第三句话</strong>
<strong>第四句话</strong>

• 块级元素在页面中默认以块的形式展现。更多的是表示一类段落的语义。
• 内联元素不会导致文本换行。更多的表示一个词、一句话等语义。

空元素(Empty Element)

**不是所有元素都拥有开始标签，内容，结束标签。**一些元素只有一个标签，通常用来在此元素所在位置 插入/嵌入一些东西。例如：元素 是用来在元素 所在位置插入一张指定的图片。

<img src="图片地址源">

常见的元素介绍

• 标题： <h1> 到<h6>从大到小
• 段落： <p>
• 列表:

无序列表： <ul> </ul>

有序列表(): <ol></ol>

列表项目():<ls><ls>

• 超链接： <a>

<p><a  targey="_blank" href="http://www.baidu.com/"></a></p>

• 图片：

<img src=“图片”>

• 块级无语义元素：

 <div></div>

无语义元素，通常是用来组织内容，方便之后通过 css 或者 js 对其进行布局或操作。

• 内联无语义元素