今天第一天学习有关网站前端的东西，感觉挺合胃口的，虽然一点基础没有，但是还是很有兴趣的，所以学起来也是很有劲儿。接受起来也比较容易，所以我也做了一些笔记和学习到的代码，希望对自己以后会有帮助！！！！
超文本传输协议《http hypertext transfer protocol》
URL<uniform resource locaor >
html 超文本标记语言《hypertext marked language》一种编程语言 浏览器解释语言
css《scascading style sheets》层叠样式表
1；<html>
<!--头标签-->
<head>
<!-- 编码 -->
<meta charset="utf8">
<!--标题标签-->
<title></title>
<style>
#a {width: 400PX;宽度
height: 500PX;高度
background-color: #00ff00;folat：lef；浮动 想左} 方块
#b{width: 400PX;
height: 500PX;
background-color: #aa0000;}
</style>
</head>
<!--体标签-->
<body>
<div id="a"></div>
<div id="b"></div>
</body>
</html>
2；<html>
<!--头标签-->
<head>
<!-- 编码 -->
<meta charset="utf8">
<!--标题标签-->
<title></title>
<style>
#a {width: 100PX;
height: 100PX;
background-color: #00ff00;float: left;}
#b{width: 100PX;
height: 100PX;
background-color: #00ff00;float:left;} 田字格
#c{width: 100PX;
height: 100PX;
background-color: #aa0000;float:left;}
#d{width: 100PX;
height: 100PX;
background-color: #aa0000;float: left;}
.clean{clear: both;}
</style>
</head>
<!--体标签-->
<body>
<div id="a"></div>
<div id="b"></div>
<div class="clean"></div>
<div id="c"></div>
<div id="d"></div>
</body>
</html>
3；<html>
<!--头标签-->
<head>
<!-- 编码 -->
<meta charset="utf8">
<!--标题标签-->
<title>搭噶好</title>
<style>
div{width: 50PX;
height: 50PX;}
#a{background-color: #aa0000;float: left;}
#b{background-color: #00ff00;float: left;}
#c{background-color: #00ff00;float: left;} 另类方块儿
#d{background-color: #aa0000;float: left;}
.clean{width:0PX;
height:0PX;
clear:both;}
</style>
</head>
<!--体标签-->
<body>
<div id="a">田</div>
<div id="b">字</div>
<div class="clean"></div>
<div id="c">格</div>
<div id="d">儿</div>
</body>
</html>
原文：http://12254264.blog.51cto.com/12244264/1870394