<html>
<title>最简单的静态页面</title>
<body>This is a simplest static page demostration.</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/htmlcharset=utf-8" />
<title>溅</title>
<style>
<!--
body {
background:url(img/bg9.gif)
margin:0px
padding:0px
}
.pic{
border:1px solid #00406c
}
p {
padding-top:30px
color:#001671
}
p.con{
padding-left:4px
padding-right:4px
}
p.title {
paddin-top0px
}
.chara1 {
font-size:12px
background-color:#90bcff
}
.chara1 td{
text-align:center
}
.chara2 {
background-color:#d2e7ff
text-align:center
font-size:12px
vertical-align:top
}
.chara3 {
background:#e9fbff url(img/self.jpg) no-repeat bottom right
vertical-align:top
padding-top:15px
padding-left:30px
font-size:12pxpadding-right:15px
}
-->
</style>
</head>
<body>
<table align="center" cellpadding="1" cellspacing="0">
<tr><td><img src="img/banner3.jpg" border="0" /></td></tr>
</table>
<table width="600px" cellpadding="2" cellspacing="2" class="chara1" align="center">
<tr><td>首面</td><td>心情日记</td><td>Free</td><td>一起走到</td><td>从明天起</td><td>纸飞机</td><td>下一站</td></tr>
</table>
<table width="600px" align="center" cellpadding="0" cellspacing="1">
<tr>
<td width="150px" class="chara2"><p><img src="img/selfpic.jpg" class="pic"/><br />我的日记本</p>
<p class="con">他们彼此深信，是瞬间并发的热情让他们相遇。这样的确定是美丽的，但变幻无常更为美丽。</p>
<p><img src="img/selfpic2.jpg" class="pic"/><br/>心情轨迹</p>
<p class="con">董事长的一切都让人既羡慕又忌妒，但更让人受不了的是，有一天，上苍忽然赐给他一个神奇的礼物</p> </td>
<td class="chara3">
<h4>介绍</h4>
<p>我努力的抓紧世界，最后却仍被世界淘汰，如果一开始就松手，我会不那么伤心吗？你说，亲爱的孩子，世事难料，随它去吧！</p>
<h4>照相本子</h4>
<p>关于童年，你记住了什么？ <br>
两岁时，我拥有一只巨大的粉红猪，它总在我嚎啕大哭时逗我笑。<br>
三岁时，我骑着小木马一路摇到外婆家，它不喝水也不吃草。<br>
四岁时，我离家出走，在公车上睡着了，最后是太空超人送我回家。<br>
我真的没骗你，我通通都记得，还有照片为证。
</p>
<h4>地下铁</h4>
<p>天使在地下铁的入口，<br>
和我说再见的那一年，<br>
我渐渐看不见了。<br>
十五岁生日的那年秋天早晨，<br>
窗外下着毛毛雨，<br>
我喂好我的猫。<br>
六点零五分，<br>
我走进地下铁。</p>
<h4>向左走向右走</h4>
<p>They're both convinced<br>
that a sudden passion joined them.<br>
Such certainth is beautiful,<br>
but uncertainty is more beautiful still.</p>
<br>
</td>
</tr>
</table>
</body>
</html>
具体步骤如下：
静态网页现阶段主要采用DIV+CSS+Javascript来实现,
第一步:在桌面上创建一个文本文件
第二步:将文本名改为"test.html"(扩展名为.html或者.htm即可,看不见扩展名可以到)
第三步:文件名改好后,右击打开方式,选择记事本
第四步:写代码。
html代码写成下图这样即可:
2.css代码写在下图区域内:
3.javascript代码写在下图区域内:
第五步:在这些代码区域内写上你的代码
第六步:保存该文本文件然后右击打开选择一个浏览器打开如果出现“已限制网页运行脚本。。。”点击允许。
代码如下：
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
<img src="这里填你的图片名字，例如1.jpg，图片跟html放在同一个文件夹下面就行">
<img src="2.jpg">
<img src="3.jpg">
<p>这里输入你想要输入的文字</p>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）