我已經在Codecademy完成了我的HTML和CSS課程,現在我想學習Python。爲什麼我無法在此HTML文檔中添加更多段落?
在此之前,我想建立一個關於我即將學習的東西的小網站,只是爲了練習我的HTML和CSS技能。
我遇到了麻煩,因爲我無法在我的HTML文件下面添加更多內容,也不知道爲什麼。
下面是HTML(也http://pastebin.com/br4W1YGL):
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<title>Python</title>
</head>
<body>
<div class="texto">
<h2>Welcome to the Flying Circus</h2>
<p>Python is a powerful, flexible programming language you can use in web/Internet development, to write
desktop graphical user interfaces (GUIs), create games, and much more. Python is:</p>
<ul>
<li><strong>High-level</strong>, meaning reading and writing Python is really easy—it looks a lot like regular English!</li>
<li><strong>Interpreted</strong>, meaning you don't need a compiler to write and run Python! You can write it here at Codecademy
or even on your own computer (many are shipped with the Python interpreter built in—we'll get to the interpreter later in this lesson).</li>
<li><strong>Object-oriented</strong>, meaning it allows users to manipulate data structures called <strong>objects</strong> in order to build and execute programs.
We'll learn more about objects later.</li>
<li><strong>Fun to use</strong>. Python is named after Monty Python's Flying Circus, and example code and tutorials
often refer to the show and include jokes in order to make learning the language more interesting.</li>
</ul>
<p>This course assumes no previous knowledge of Python in particular or programming/computer science in general.</p>
<div id="instrucoes">
<h4>INSTRUCTIONS</h4>
<p>Ready to learn Python? Click Save & Submit Code to continue!</p>
</div>
<div id="hint">
<h4>Hint</h4>
<p>If the loading bar fills but doesn't fade away, try refreshing the page.</p>
</div>
</div>
<a id="voltar" href="#">[ voltar ]</a>
<div class="codigo">
print "Welcome to Python!"
</div>
<p>oi<p>
</body>
</html>
而CSS(http://pastebin.com/48XvxedE):
html, body, form, fieldset, legend {
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0;
}
fieldset,img {
border: 0;
}
legend{
color: #000;
}
sup {
vertical-align: text-top;
}
sub {
vertical-align: text-bottom;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
caption, th, td {
text-align: left;
vertical-align: top;
font-weight: normal;
}
input, textarea, select {
font-size: 110%;
line-height: 1.1;
}
abbr, acronym {
border-bottom: .1em dotted;
cursor: help;
}
/*o meu código começa aqui, o código acima é um reset*/
/*fonte do reset: http://www.maxdesign.com.au/articles/css-reset/ */
html {
width: 1300px;
margin: 0 auto;
font-family: sans-serif;
font-size: 0.95em;
color: #424242;
background-color: #FFFFFF;
}
body {
}
.texto {
position: absolute;
top: 20px;
width: 550px;
}
#instrucoes {
background-color: #FAFAFA;
width: 536px;
padding: 5px;
color: #585858;
border: 2px solid #D8D8D8;
}
#hint {
background-color: #FAFAFA;
width: 536px;
padding: 5px;
color: #585858;
border: 2px solid #D8D8D8;
margin: 10px 0 0 0;
}
.codigo {
position: absolute;
left: 630px;
top: 65px;
padding: 10px;
width: 676px;
height: 420px;
background-color: #e6efc2;
color: #264409;
border: 2px solid #c6d880;
font-family: mono;
font-weight: bold;
font-size: 0.85em;
}
#voltar {
position: absolute;
left: 1275px;
top: 25px;
color: #585858;
}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {background-color: #F2F2F2; }
a:active {text-decoration: none;}
hr {
border: 0;
width: 100%;
color: #D8D8D8;
background-color: #D8D8D8;
height: 2px;
}
這裏是我的jsfiddle:http://jsfiddle.net/MBMf2/
這裏有人知道我爲什麼不能添加更多段落?
對不起,我已經完成了這個項目,不過謝謝! ;) – vcamargo
@ GoodbyeEarl,沒問題,很高興幫助:) – Baumr