css - 两串一模一样的代码，运行结果不一样
本文介绍了css - 两串一模一样的代码，运行结果不一样的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
初学者，在学习div+css的用法，照着教程的代码打了一遍，但是运行结果却不同
教程代码如下：
<!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=utf-8" />
<title>DIV+CSS</title>
<style type="text/css">
#Container{
width:1000px;
margin: 0 auto;
background:#CF3;
}
#Header{
height:80px;
background:#093;
}
#logo{
padding-left:50px;
padding-top:20px;
padding-bottom:50px;
}
#Content{
height:600px;
margin-top:20px;
background:#0FF;
}
#Content-Left{
height:400px;
width:200px;
margin:20px;
float:left;
background:#90C;
}
#Content-Main{
height:400px;
width:720px;
margin:20px;
float:left;
background:#90C;
}
#Footer{
height:40px;
background:#90C;
margin-top:20px;
}
.Clear{
clear:both;
}
</style>
</head>
<body>
<div id="Container">
<div id="Header">
<div id="logo">
这里设置了padding属性介绍一下padding的用法,padding将设置文本与边框的距离。
</div>
</div>
<div id="Content">
<div id="Content-Left">Content-Left</div>
<div id="Content-Main">Content-Main</div>
</div>
<div class="Clear">
</div>
<div id="Footer">
Footer
</div>
</div>
</body>
</html>
运行结果如下图
我自己打的代码如下
<!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=utf-8" />
<title>DIV+CSS</title>
<style type="text/css">
#Container{
width: 1000px;
margin: 0 auto;
background: #CF3;
}
#Header{
height: 80px;
background: #093;
}
#logo{
padding-left: 50px;
padding-top: 20px;
padding-bottom:50px;
}
#Content{
height: 600px;
margin-top: 20px;
background: #0ff;
}
#Content-Letf{
height: 400px;
width: 200px;
margin: 20px;
float:left;
background: #90C;
}
#Content-Main{
height: 400px;
width: 720px;
margin: 20px;
float:left;
background: #90C;
}
#Footer{
height: 40px;
background: #90C;
margin-top: 20px;
}
.Clear{
clear:both;
}
</style>
</head>
<body>
<div id="Container">
<div id="Header">
<div id="logo">
这里设置了padding属性介绍一下padding的用法,padding将设置文本与边框的距离。
</div>
</div>
<div id="Content">
<div id="Content-Left">Content-Left</div>
<div id="Content-Main">Content-Main</div>
</div>
<div class="Clear">
</div>
<div id="Footer">
Footer
</div>
</div>
</body>
</html>
运行结果如下图
代码一样的啊，但是Content-Left这里不对，我找不到哪里有错误，是哪里出错了呢？
解决方案
#Content-Letf{
拼写错误
这篇关于css - 两串一模一样的代码，运行结果不一样的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
