什么是HTML

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。它负责网页的内容和结构，例如在一篇博客中可以用它来展示博客的内容以及标记博客的标题、正文等。

后来为了更好的展示内容HTML中也加入了一些新的标签，例如font，i等，但是这与程序设计理念（单一职责原则）不符，这样导致的问题就是可读性降低（内容和格式混合到一起），维护困难，变更风险高（如果修改段落字体的话需要的代价大），因此要加入样式的话必须要内容和样式分离。

css

如果想要控制样式，必须要先实现选择功能，也就是要定位到HTML中的要装饰的元素，然后才能给出如何显示它。

由于HTML可以理解为一个DOM树，每个节点都表示HTML中的一个元素，
在css中使用选择器来定位元素，比如说想把所有的h3都变成红色， 黑体， 可以这么写：

h3 {color:blue ; font-weight:bold;}

实际上选择器可以实现更复杂的选择操作：

这样我们就解决了为特定HTML元素指定样式的操作，接下来要解决的问题就是排版，在HTML中块级元素（比如标题和段落） 会一个接一个的堆叠起来沿着页面向下排列，每个元素占一行； 行内元素（比如链接和图片）则会在一行内相互并列，只有在空间不足以并列的时候才会折到下一行。你可以想象一下， 一个文档其实就是这些元素在页面上堆叠流动而已， 俗称文档流。

为了更加灵活的排版，我们把这些元素看成一个个盒子，只要指定了这些盒子在页面中的地址就完成了文档的排版。

每个盒子都有这三个属性：

边框（border）： 可以设定宽窄，样式，颜色
内边距(padding)： 内容到边框的间距
外边距(margin)： 边框到相邻元素的间距

这样可以实现各个元素自己的块级格式，还需要解决整体的元素排列，两个重要的属性：float和position 。

float可以让一个盒子脱离标准的文档流，一直往上飘，直到遇到父元素的边界。

对于position 来说， 那就更加灵活了。 如果不设置，那就是默认定位，在文档流中的位置不做改变。

以上就实现了分离内容和样式的功能(不再使用HTML中的标签控制显示)，使用HTML表示文档的内容以及文档内文字的地位（标题or正文），使用css控制HTML中元素的显示、排列方式。

程序员可以直接写到元素的标签中（叫行内样式）， 也可以写到html的 < style>标签里（这叫嵌入样式）， 当然我是建议大家写到单独的CSS样式中，然后通过链接的方式和html内容结合起来。

JavaScript

通过HTML和css可以使得网页显示丰富的内容和漂亮的样式，但是缺点就是开发人员想要改变网页的显示必须重新向服务器发送请求，这时就需要使用JavaScript可以改变页面显示效果，它可以在用户进行操作时对HTML进行修改。