HTML标记区分
HTML即超文本标记语言（HtyperText Markup Language），其作用就是将编辑的内容在屏幕上显示。文件的后缀为.HTML。
在HTML中成对出现的叫做双标记（譬如：<p></p>,<a></a>等等；其中<p>称为开始标记，</p>称为结束标记），而有些标记单独出现，譬如（<br />,<hr />），等这些称为单标记
（而在网页中单标记比较少）
CSS
CSS（Cascading Style Sheets），即层叠样式表。其作用就是给网页的显示增加色彩的效果，美化网页。文件的后缀为.CSS。
JavaScript
JavaScript又称为脚本。为网页添加动态效果。原生的JavaScript现在很少人在用，大多数人现在使用的是jQuery。文件的后缀为.JS或者.JQ
一个HTML该怎么写
首先在head中定义样式，或者脚本。title 表示显示的网页名字。body 又称为主体部分，显示在网页中的内容都在body中编写。
下面是代码：第一个网页hello word
1 <!doctype html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 5 <title>注册</title> 6 </head> 7 <body> 8 <p>hello word</p> 9 </body>
定义CSS样式
CSS样式的定义规则有三种
1.内联CSS样式
格式：
<标记名 style=" ;"></标记名> 其中多个样式使用；分隔开
内联式顾名思义就是在标记名内部使用。下面举例子：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <p style="font-size: 18pt;color:#FF0000;">hello word</p> <p style="font-size: 18pt;color:#00FF00;">hello word</p> <p style="font-size: 18pt;color:#0000FF;">hello word</p> </body> </html>
2.内嵌CSS样式
格式
<style type="css/text" ></style>
内联样式要在head 标记内部添加。与上一种方式相比，此方法可以简化代码。以减少代码量，通过比较不难发现如果同时定义的内联式要写三遍，而下列方式只需要修改特定格式。
下面举例：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> p{ font-size: 18pt; color:#FF0000; } .p1{ color:#00FF00; } #p2{ color: #0000FF; } </style> </head> <body> <p>hello word</p> <p class="p1">hello word</p> <p id="p2">hello word</p> </body> </html>
3.引用外部独立的.CSS样式文件
格式：
<link type="text/css" rel="stylesheet" href=""/>
此定义方式需要在head中定义一个外部的CSS文件，你需要先定义好外部CSS样式表，然后通过link标记引用进来。与上面的方式相比，如果定义的样式过多会显得头部定义比较冗余，通过引用外部的样式表减少冗余性。
下面举例：
CSS文件中代码
1 p{ 2 font-size: 18pt; 3 color:#FF0000; 4 } 5 .p1{ 6 color:#00FF00; 7 } 8 #p2{ 9 color: #0000FF; 10 }
HTML中的代码
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <link rel="stylesheet" type="text/css" href="ceshi.css" /> 7 8 </head> 9 <body> 10 <p >hello word</p> 11 <p class="p1">hello word</p> 12 <p id="p2">hello word</p> 13 </body> 14 </html>
引用外部样式还有第二种方法
在style开头使用@import引用外部样式表（样式代码就是上面的在这就不写了）
下面是案例：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> @import "ceshi.css"; </style> </head> <body> <p >hello word</p> <p class="p1">hello word</p> <p id="p2">hello word</p> </body> </html>
原文：http://www.cnblogs.com/j839035067/p/6576388.html