用div布局,css控制
//编辑器用的是sublime
<!DOCTYPE html>
<html>
<head>
<title>Div buju </title>
</head>
<style>
#continer{
height: 1500px;
width: 1000px;
background: pink;
}
#header{
height: 300px;
background: green;
}
#bodyer{
height: 600px;
background: white;
}
#b1{
height: 600px;
width: 600px;
background: blue;
float:left;
}
#b2{
height:300px;
width: 400px;
background: red;
float:right;
}
#footer{
height: 200px;
background: gray;
}
</style>
<body>
<div id="continer">
<div id="header"></div> <!-- 头 -->
<div id="bodyer">
<div id="b1"></div> <!--b1,b2为bodyer中的布局 -->
<div id="b2"></div><!-- 宽度值之和不能大于continer的宽
度,否则不能并排显示。-->
</div>
<div id="footer"></div> <!-- 尾 -->
</div>
</body>
</html>
1.DOCTYPE标签是一种标准通用标记语言的文档类型声明,它的目的是要告诉标准通用标记
语言解析器,它应该使用什么样的文档类型定义(DTD)来解析文档。
作用:声明文档的解析类型(document.compatMode),避免浏览器的怪异模式。
document.compatMode:
BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。
CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。
这个属性会被浏览器识别并使用,但是如果你的页面没有DOCTYPE的声明,那么
compatMode默认就是BackCompat。
2.<html xmins= "http://www.w3.org/1999/xhtml">是什么意思
xmlns是XHTML namespace的缩写。
作用:由于xml允许定义自己的标记,但你定义的标记和其他人定义的标记有可能相同,但
表示不同的含义。当文档交换或者共享的时候就容易产生错误。为避免这种错误产生,xml
采用名字空间声明,允许你通过一个网址来识别你的标记。
XHTML是HTML先xml过度的标记语言,它需要符合xml文档规则,因此,也需要定义
名字空间,又因为XHTML1.0不能自定义标识,所以,它的名字空间都相同,就是:
http://www.w3.org/1999/xhtml
3.注释:<!-- 注释内容 --> 及 /* */
4.注意编码问题,一般使用UTF-8 能显示中文