HTML的基本认识

1.HTML

HTML全称是Hypertext Markup Language，中文名字是超文本标记语言。那么什么叫做超文本标记语言，我们一次解析一下。

语言

这里的语言是指要和浏览器打交道，这个语言是浏览器能够识别的。

标记

标记产自于外国，所以标记是不允许使用汉文来写的，他必须由尖括号包裹起来。标签通常是成对出现的，标签对中第一个称为开始标签，第二个称为结束标签。开始标签和结束标签也被称为开放标签和闭合标签。当然也存在空元素，空元素是在开始标签中关闭的。（空元素也可以称为单标签，以反斜杠结束）

超文本

一个网页上的文字就叫做文本，但是一个网页上不仅有文本还有图片、声音、视频。而这些图片、声音、视频远远超出了文本所覆盖的内容。这就称为超文本。

2.HTML的书写格式

首先告诉浏览器我要开始写一个文档里，文档使用doc（document）表示的。同时我还需要告诉浏览器我的文档类型，文档类型用type表示。那么到底文档类型是什么？所以在后面告诉浏览器的是HTML类型。总结一下，声明的写法是：
<!doctype html>
写完声明之后，接下来开始写网页，就要用到了HTML标签（所有的网页一出现就是一个整体，这个整体就是HTML来标记）。这个整体都会包含一个头部和一个主体，头部包含了标题名、网址等。主体就是我们看到的页面。因此，接下来要写的是头部和主体。这就引入另外的两个标签head和body。总结一下，写法：

<!doctype html>
<html>
　　　　<head><head/>
　　　　<body><body/>
<html/>

刚才我们说到head中会有标题名，也就是在head中添加一个title标签。为了让我们所写的网页在全世界都能解析出来，我们还要添加一个标签meta(这就是上面提到的空元素标签，他的内容在meta后面在反斜杠之前结束)，标签中提供编码方式。在HTML加了个lang属性，是指定元素内容的语言，en表示为英文，浏览器打开后它会认为是英文的，会自动给翻译（如果设置了自动翻译的话），当然这个属性是可以用不用写的。具体写法如下：

<!doctype html>
<html lang="en">
　　　　<head>
　　　　　　　　<meta charset="utf-8"/>
　　　　　　　　<title><title/>
　　　　<head/>
　　　　<body><body/>
<html/>

在这里我们继续说说这个编码的问题。当我们用文本文档编写的时候，保存时将其后缀名修改为.html，容易出错的是我们忘记将其编码方式也修改为utf-8，如果不改，仍然出现乱码的情况。其实上面的内容在文件创建的时候很多编辑器都帮我们完成以上内容的书写，我们基本完成我们需要的布局即可。

3.css

css全称为Cascading Style Sheet，即层叠样式表。他是通过键值对的方式来实现的。
<div style="width:100px;height:100px;background:url(http://img1.3lian.com/2015/w7/98/d/22.jpg);border:8px solid blue;">这是一张图片</div>
图片上是对层叠样式表的个人理解：

层叠样式.png

注意
上面采用的是内联样式表插入的方法，注意每条命令后面有个分号，尤其最后一个命令后面也有。经过测试，最后一个分号是可以没有的，键值对间的分号不能少，个人建议都把分号加上。

3.JavaScript

JavaScript是脚本语言，给了我们页面一个动作。在这里给出个事例：

<div onclick="this.style.width='800px';this.style.height='800px'"
style="width : 100px;height : 100px;transition:1s;
background:url(http://img1.3lian.com/2015/w7/98/d/22.jpg);
border : 8px solid blue;">这是一张图片</div>

我们主要看下面的内容

onclick="this.style.width='800px';this.style.height='800px'"

这句话中onclick表示给div 一个点击事件。那么点击后会发生什么事那？this可以理解为一个代词，代指当前的标签div,点可以理解为“的”，那么可以将其翻译为，给div一个点击事件，点击后，div的样式表中的width值修改为800px,div的样式表中的height值修改为800px。style中的transtion,表示该事件执行的时间。

在这里我们区分一下JavaScript写法和css写法的区别：

JavaScript中的键值对是通过等号连接，css是通过冒号连接；
JavaScript中的值需要用引号包裹起来（引号包裹的时候是有要求的，如果最外面的是双引号，那值就用单引号，如果外面是单引号，那么值中就是用双引号，这里说的比较简单，详细内容可以百度一下）。css中不需要用引号包裹。

如果有错误的地方，欢迎大家指出来。