网页版面出现错乱的情况有哪些？
- 检查元素如
div开始和结束标签是否正确 - 审查元素 发现 多了个标签，或者标签结构不是你写的结构，一定是什么原因，标签的父子关系搞错了，或者上面说的标签没有结束，或者嵌套层级出了什么问题
- 没有清除浮动带来的影响，父元素得不到子元素的高度。 或者元素宽度的问题
- 没有保存代码，当然这个点取决于你用的什么开发工具，不过养成保存这个习惯是程序员必备素质。
- 等等
写的css代码不生效，或者开始代码是好的，后面代码出现了问题，好奇怪？
1.检查代码是否已经保存代码
2.css 代码的问题
- 把html注释<!—html注释 -->写在css注释里面去了，解决的办法可以统一使用快捷键加注释，ctri+/
- css里面的代码有问题，少了大括号，多了大括号，不小心多打了几个字母或文字
- 选择器写错了
- 注意删东西的时候不要多删，或者残留，造成错误
- 遇到问题随便定义div，不知道怎么去解决，乱定义div
大错特错：不知道怎么解决问题，随便定义个标签，比如div，刷新看看有没效果
发现有时候解决了问题，也不知道为什么？这只是一个巧合，不知道还是不知道
正确做法：
- 一一排除问题，审查元素看看，在浏览器修改css属性排查问题
- 检查宽高，浮动是否有影响，属性值设置是否正确
- 设置元素边框 或 背景色来调试看看
- 单独写一个html文件，测试这个问题的存在，一定要搞明白为什么
建议：
- 一边写一边看效果，不要写很多了再去看，不然后期排错不容易。
- 出了问题一定要学会自己先通过控制台查看
- 控制台 查看的点，样式是否生效，或者是权重不够，或者继承了某些属性，
个人犯过的问题：
- 项目中大板块用
id来区分，但是写css样式的时候，本来是要给加一个类名，增减样式，但是两次（第一次还不是第一次写项目的时候，好像是我个人的第三个项目的时候，估计状态不好，第二次的时候也是在那个项目里，当时特想抽自己）都将类名加入id的后面，此时一个是没有这个类名，而且id的值里面含有空格，通过控制台查看，完全没有样式。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>不允许存在空格</title>
<style>
#demo {
width: 200px;
height: 220px;
background-color: #cccccc;
}
#demo .test {
width: 100px;
height: 110px;
background-color: #fff222;
}
</style>
</head>
<body>
<!-- 错误演示代码 -->
<!-- 此处加了一个空格-->
<div id="demo box">
<div class="test"></div>
</div>
</body>
</html>
通过控制台查看 ：
错误演示-控制台查看图1image.png
错误演示-控制台查看图2image.png
此处应该再写一下，命名的规则：
- 可以包含字母，数字，下划线(_)，短横线（-），但是不能以数字开头
- css中不建议用下划线，建议使用短横线（与js区分开）
- 区分大小写
- 最好有语义，使用英文，不要随意简写
