帮我解读这个网页代码

来源:百度知道 编辑:UC知道 时间:2024/06/09 17:08:42
帮我解读一下style里面都是干什么用的我看的不是太明白

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
.container {width: 950px;}
.span-6, .span-18 {margin-right: 10px; float: left;}
.span-6 {width: 230px; background-color:#00FF00}
.span-18 {width: 710px; background-color:#FF0000}
.last {margin-right: 0}
.clear {clear: both; display: block; height: 0;}
.container {margin: 0 auto; width: 950px;}
</style>
</head>
<

<div class="container"> 宽 950像素 居中

<div class="span-6">左</div> 宽 250像素 背景色为:#00FF00 右边距为10像素 左对齐(也就是下的span-18模块会在span-16的右边)

<div class="span-18 last">右<br /></div> 背景色为:#FF0000 宽 710像素 右边距为0

<div class="clear"></div> 清除外界的影响(如果span-18用的话,span-6的左对齐就对span-18不起作用)

<style>
.container {width: 950px;} 网页宽度
.span-6, .span-18 {margin-right: 10px; float: left;}SPAN-6部分居右
10象素
.span-6 {width: 230px; background-color:#00FF00}
SPAN-6部分宽度230象素,背景色
.span-18 {width: 710px; background-color:#FF0000}
.last {margin-right: 0}
.clear {clear: both; display: block; height: 0;}
.container {margin: 0 auto; width: 950px;}
</style>

类似的就不解释了。