我们根据上面的信息，来测试一下，首先编写一下HTML文件：
<body> <div>我是测试文本内容</div> </body>现在我们来编写一下css文件：
.test { color: yellow; } #simple { color: red; } * { color: palegreen; }那么现在我们可以看到，实际上生效的是我们直接编写在标签内部的内联属性，那么现在我们依次进行移除，来看看它们的优先级。
那么如果我们希望某个属性无视任何的优先级，我们可以在属性后面添加!important标记，表示此属性是一个重要属性，它的优先级会被置为最高。
思考：那要是我每个选择器的这个属性后面都加一个!important会怎么样？
自定义边距我们来看看，如何使用css控制一个div板块的样式，首先编写以下代码，相当于一个div嵌套了一个div元素：
<div> <div> </div> </div>现在编写一下自定义的css样式，我们将div设定为固定大小，并且背景颜色添加为绿色：
#outer { background: palegreen; width: 300px; height: 300px; }我们发现左侧快速预览页面存在空隙，这是因为浏览器给我们添加了一个边距属性，我们只需要覆盖此属性并将其设定为0即可：
body { margin: 0; }现在我们给内部嵌套的div也设定一个大小，并将颜色设定为橙色：
#inner { background: darkorange; width: 100px; height: 100px; }现在我们发现内部的div元素位于右上角，我们还可以以百分比的形式来指定大小：
#inner { background: darkorange; width: 100%; height: 100%; }百分比会依照当前可用大小来进行分配，比如当前位于一个div内部，并且外部div元素是固定大小300px，因此100%就相当于使用了外部的全部大小，也是300px，现在内部元素完全将外部元素覆盖了，整个元素现在呈现为橙色。
我们可以为一个元素设定边距，边距分为外边距和内边距，外部元素内边距决定了内部元素与外部元素之间的间隔，我们来修改一下css样式：
#outer { background: palegreen; width: 300px; height: 300px; padding: 10px; }我们发现，内部的div元素小了一圈，这是因为外部div元素设定了内边距，上下左右都被设定为10px大小。
而我们发现，实际上我们在一开始也是将body的外边距设定为了0，整个页面跟浏览器窗口直接间隔0px的宽度。
JavaScript语言也称为js，是我们整个前端基础的重点内容，只有了解了JavaScript语言，我们才能了解前端如何与后端交互。
JavaScript与Java没有毛关系，仅仅只是名字中包含了Java而已，跟Java比起来，它更像Python，它是一门解释型语言，不需要进行编译，它甚至可以直接在浏览器的命令窗口中运行。
它相当于是前端静态页面的一个补充，它可以让一个普通的页面在后台执行一些程序，比如我们点击一个按钮，我们可能希望执行某些操作，比如下载文件、页面跳转、页面弹窗、进行登陆等，都可以使用JavaScript来帮助我们实现。
我们来看看一个简单的JavaScript程序：
const arr = [0, 2, 1, 5, 9, 3, 4, 6, 7, 8] for (let i = 0; i < arr.length; i++) { for (let j = 0; j < arr.length - 1; j++) { if(arr[j] > arr[j+1]){ const tmp = arr[j] arr[j] = arr[j+1] arr[j+1] = tmp } } } window.alert(arr)这段代码实际上就是实现了一个冒泡排序算法，我们可以直接在页面的头部中引用此js文件，浏览器会在加载时自动执行js文件中编写的内容：
<script src="http://www.likecs.com/test.js"></script>我们发现JS的语法和Java非常相似，但是它还是和Java存在一些不同之处。
JavaScript基本语法在js中，定义变量和Java中有一些不同，定义一个变量可以使用let关键字或是var关键字，IDEA推荐我们使用let关键字，因为var存在一定的设计缺陷（这里就不做讲解了，之后一律使用let关键字进行变量声明）：
let a = 10; a++; window.alert(a)上面的结果中，我们得到了a的结果是11，也就是说自增和自减运算在JS中也是支持的，并且JS每一句结尾可以不用加分号。
js并不是Java那样的强类型语言（任意变量的类型一定是明确的），它是一门弱类型语言，变量的类型并不会在一开始确定，因此我们在定义变量时无需指定变量的确切类型，而是在运行时动态解析类型：
let a = 10; a = "HelloWorld！" console.info(a)我们发现，变量a已经被赋值为数字类型，但是我们依然在后续能将其赋值一个字符串，它的类型是随时可变的。
很多人说，这种变态的类型机制是JS的一大缺陷。
世界上只有两种语言：一种是很多人骂的，一种是没人用的。
我们接着来看看，JS中存在的基本数据类型：
Number：数字类型（包括小数和整数）
String：字符串类型（可以使用单引号或是双引号）
Boolean：布尔类型（与Java一致）
还包括一些特殊值：
undefined：未定义 - 变量声明但不赋值默认为undefined
null：空值 - 等同于Java中的null
NaN：非数字 - 值不是合法数字，比如：
window.alert(100/\'xx\')我们可以使用typeof关键字来查看当前变量值的类型：
let a = 10; console.info(typeof a) a = \'Hello World\' console.info(typeof a) JavaScript逻辑运算和流程控制