赢在职场－WEB全栈开发－1-1初识前段、1-2浅析、1-3CSS的位置
什么是语言？
语言是交流的工具。人与人交流，使用如中文、英文之类的语言。前段程序猿与浏览器交流则使用浏览器前端语言之类的计算机语言。
浏览器前端语言大致有：html（Hyper Text Markup Language(超文本标记语言)）：如一栋大楼，主要负责结构。css（Cascading Style Sheets(层叠样式表(cascade |kæˈskeɪd| n 小瀑布、瀑布状物 v 层叠))）：如一栋大楼中的装修，主要负责样式、装修。js（Javascript(script |skrɪpt| n 剧本、脚本)）：如小区中的物业，主要负责行为。
*********************************************************************************************************
<>标记
<html>标签
<html>/<html>标签对(起始标签、闭合标签)
页面:
<html>
<head>
<title>头部，抬头</title>
</head>
<body> 内容</body>
</html>
<!doctype html><!文档类型声明 document type,感叹号代表这是一个注释>
<html>
<head>
<title>抬头</title>
<meta charset="utf-8">
<!metadata |ˈmetədeɪtə| noun 元数据 猜测meta就是metadata的意思>
<!charset 英 [t'ʃɑ:set] 美 [t'ʃɑ:set] n.字符集、编码; 字符编码; 编码格式>
<!代码解析格式,UTF-8国际通用编码。中国，系统默认的编码一般是GBK编码或GB2312(1981年颁布)编码，注意编辑时使用什么编码，meta中就就尽量设置成什么编码>
<!GBK:Chinese Internal Code Specification(specification |ˌspesɪfɪˈkeɪʃn| n 规格、要求、明确说明),汉字内码扩展规范，1995年颁布>
</head>
<body>
内容<!在head中可以设置编码方式>
</body>
</html>
*********************************************************************************************************
DIV是层叠样式表中的定位技术，全称Division(division |dɪˈvɪʒn| noun 分开、分配)，即为划分。有时可以称其为图层。DIV元素是用来为HTML（标准通用标记语言下的一个应用）文档内大块（block-level）的内容提供结构和背景的元素。
<!doctype html>
<html>
<head>
<title>抬头</title>
<meta charset="utf-8">
<style>
.InternalStyle1{width:400px;height:50px;background:green;}
</style>
<style>
. InternalStyle2{width: 300;height: 100;background:red;}
</style>
<link href="main.css" rel = "stylesheet"/> <!Hypertext Reference的缩写,意思是超文本引用。引入外部样式,外部CSS引用><!relationship的英文缩写·REL属性用于定义链接的文件和HTML文档之间的关系。StyleSheet，的意思就是样式调用。>
</head>
<body>
<!行内样式(Internal Style(internal |ɪnˈtɜːnl| adj 里面的、内部的))><!实际网页可能有上千个盒子，使用行内样式这种方式就不方便了>
<div style="width:300px;height:100px;background:red"> </div>
<!内部样式><!内部样式只能用于某一个html内部，若若干个网页使用同一个样式，则很难维护>
<div class="InternalStyle1"></div>
<div class="InternalStyle2”></div>
<!外部样式><!通过链接引入>
<div class="ExternalStyle">外部样式</div>
</body>
</html>
main.css
.ExternalStyle{width: 300;height: 50;background:blue;}<!外部样式>
*********************************************************************************************************