HTML&CSS基础

本代码均由本人亲手所写，内容简单，适合零基础的菜鸟学习，欢迎参阅！希望能帮到大家！

</head>

<body>

<a href=”4-1.html”>吻吻你</a><br /><br />

<center><h3>趣味故事:肚子和兔子</h3></center>

    一次一位旅客陪伴他的母亲到北京旅游，列车开至中途，他的母亲患了急性肠胃炎，肚子痛的直不起腰，记得他在车上到处打听医生，没找着，最后他只好到列车广播室求助，他用不咸不淡的普通话对播音员说，”同志，麻烦你，我母亲的兔子（肚子）有病，请你帮我找广播，找个医生看看。”两分钟后，播音器发出了广播。“旅客们请注意，在第八号车厢25号座的老大娘兔子有病，旅客中有能医治的，请前往救治。”不一会，果然有一位当过兽医的来到那位老大娘身边，问：“大娘，你的兔子怎么了？”那个旅客抢先插一句，她可能是急性肠胃炎，“那位兽医听了不禁大叹一声，原来是这位大娘的肚子痛，

</body>

</html>

<title>创建文本超链接</title>

</head>

<body>

<center><h3>趣味故事：吻吻你</h3></center>

<a href=”4-1(1).html”>肚子和兔子</a><br /><br />

    有个深圳人到北京出差，因人生地不熟，走动街上，往回走时竟找不到回去的路，于是想路旁的一位年轻姑娘问路：“小姐，吻吻（问问）你啦······”话还未说完，脸上“啪”的挨了一巴掌，打得他丈二和尚摸不着头脑，捂着发红的脸颊，冲姑娘叫道：”你这个小姐，怎么乱打人啊？“<br />

”就打你这个流氓。”<br />

“你这么金贵啊！吻吻你（问问）都不行啊？”<br />

“啪”的一声，姑娘又是一巴掌打过去，并骂道：“你这个流氓，以为在美国啊！”<br />

顿时，过往行人都围上来看热闹，其中有位在北京工作多年广东人，听了姑娘的骂声，不由得哈哈大笑起来，然后把深圳人拉过一边说：“老乡，你要好好学学普通话了，你把问说成吻了，这位姑娘能不生气吗？两巴掌白挨了。”

</body>

</html>

<title>设置超链接的目标窗口</title>

</head>

<body>

<center><h2>荣智技术学院简介</h2></center>

<font size=”+1″>http://www.rachia.net</font></body>

荣智技术学院自开办一来。<br />

如果有兴趣的读者，还可以从相关公司论坛学习。

</body>

</html>

<title>设置超链接的目标页面</title>

</head>

<body>

<center><h3>荣智技术学院</h3></center>

<hr size=”2″ color=”#990000″ />

<font size=”4″>http://www.rzchia.net</font><br /><br />

荣智技术学院是一家以图书策划、创作、计算机培训为一体的优秀团队。<br /><br />

<a href=”4-2(1).html” target=”_blank”>进入详细介绍</a>

</body>

</html>

<title>内部链接</title>

</head>

<body>

<h3>http://www.163.com</h3><br /><br />

网站详情<br /><br />

    自1997年6月创立以来凭借先进的技术和优质的服务。<br /><br />

<a href=”4-3.html”>返回</a>          

<a href=”4-3(2).html”>下一个网站介绍</a>

</body>

</html>

<title>内部链接</title>

</head>

<body>

<h3>http://www.sina.com</h3><br /><br />

网站详情<br /><br />

      新浪在全球范围内注册用户超过1.8亿。<br /><br />

<a href=”4-3.html”>返回</a>       

<a href=”4-3(1).html”>进入下一个介绍</a>

</body>

</html>

<title>内部链接</title>

</head>

<body>

<center><h2>网站介绍</h2></center>

<hr size=”2″ color=”#33FF99″ />

<font size=”+1″>http://www.163.com</font><br /><br />

网易公司是中国领先的互联网技术公司。<br /><br />

<a href=”4-3(1).html”>进入详细介绍</a>

<hr size=”3″ color=”#33FF66″ />

<font size=”+1″>http://www.sina.com</font><br /><br />

新浪是一家服务于中国大陆以及全球华人社群的领先在线媒体及增值服务咨询商<br /><br />

<a href=”4-3(2).html”>进入详细介绍</a>

</body>

</html>

<title>设置图像的超链接</title>

</head>

<body>

    这是一首关于成长和青春的挽歌，是一个关于选择，关于成长的故事。<br />

</body>

</html>

<title>设置图像的超链接</title>

</head>

<body>

<h3>北京爱情故事</h3>

<center>

<a href=”5-9(1).html”><img src=”娃娃.jpg” hspace=”10″ title=”娃娃” /></a>

</center>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

#apDiv1 {

   position: absolute;

   width: 200px;

   height: 160px;

   z-index: 0;

   left: 120px;

   top: 120px;

   background-color: #990066;

}

</style>

</head>

<body>

<div id=”apDiv1″></div>

</body>

</html>

<title>无标题文档</title>

</head>

<frameset rows=”300,700″>

<frame src=”娃娃.jpg” />

<frame src=”10-7.html” />

</frameset><noframes></noframes>

</body>

</html>

<title>框架调用源文件</title>

</head>

<body>

<h3><font color=”#FF0033″>大脑门诊室</font></h3>

<font color=”#33CC33″><blockquote><blockquote>    前几年，东安县某医院从外地调来一个年轻的医生，一天早上，一个中年妇女拉到医院看病，年轻医生望了望这位妇女，首先拿出体温表给病人量体温，医生，我省的是什么病，中年妇女忍不住问道。你有些发烧，年轻人随口答道，什么？中年妇女一下子从凳子上跳了起来，你骂我，发骚，你在哪看见的，原来，文安人说发骚是骂人放荡勾引男人，当时年轻人不解其意。连忙说道，你是发烧吗。说着还用手模病人的额头，中年妇女大怒，猛地把医生一推，年轻医生恼火的说，你，你干什么，中年妇女怒不可解的说，你这个流氓，也不看看我是谁，想调戏我，瞎了你的眼了。<br />

    年轻人莫名其妙的说，你这是什么话，你吃屎了，你年纪轻轻，就······。中年妇女指着年轻医生不住的骂道，骂声惊动了院长，急忙赶来问年轻医生怎么回事，医生简单的说了一下，院长急忙上前劝阻中年妇女，大嫂，你不必发这么大火，他说你发烧是对的，什么？你当院长也骂我，刚才是我发骚，还是他调戏我。中年妇女哭叫着超院长撞去，院长往一旁一闪中年妇女撞在墙上，顿时昏了过去，医务人员赶忙前来抢救。院长望着昏死过去的中年妇女，长叹一声，看来农村也应该推广普通话。<br />

</blockquote></blockquote>

</font>

</body>

</html>

<title>无标题文档</title>

</head>

<frameset cols=”20%,65%”>

<frame src=”娃娃.jpg” name=”pic” scrolling=”auto” />

<frame src=”10-8.html” name=”text” marginwidth=”20″ scrolling=”auto” />

</frameset><noframes>

<center>你的浏览器不支持框架结构！</center>

</noframes>

</body>

</html>

<title>内容页面</title>

</head>

<body>

<center>

<font size=”5″>才思妙对娶佳人（1）</font>

<br /><br />

</center>

    明朝时候，山西有一位名医，家有二女，大女儿叫珍姐，二女儿叫珠妹，姊妹出落的香花一样，乔老不想把祖传艺术传给别人，于是决定招婿入赘，怎么招，他理想的女婿是即懂医道又有学问，想来想去，

</body>

</html>

<title>页面内容</title>

</head>

<body>

<center>

<font size=”5″>才思妙对娶佳人(2)</font>

</center>

     所得税法发生的爆发护手霜包括不喝酒不喝酒阿宝爆发后基本很少见发感慨发货方式就不划算吧河北不喝酒不代表不喝酒法国红酒不环保和较好的地方还不睡觉遍粉红好多个双箭股份黄金时代和德国和几个地方噶哈佛必定会vfbhjdvbhd好勇斗狠岁啊hii活了和幅度和防护和和v大好机会多了个发了固定岗v大感慨vgdjhjdfjhgdhgls 换个房间高速路接接电话法规将贷款u飞虎虎虎干撒都会固定化发广告速度感黄金股光伏

</body>

</html>

<title>内容页面</title>

</head>

<body>

<center>

<font size=”5″>六岁神童斗和尚</font>

</center>

    昏死ufaiuehruhihsiof his和覅哦好的死哦凤凰山开户费hfsklhfsh甩灯歌恢复高考几分感慨发给谁就会感慨和散热与鼓舞i非公开价格覅u的佛塑股份双方各iu树官方苦涩的国库股市和大哥速度了光伏等过了速度换个房间的房价肯定感到官方四个房间多开个房间大公司加快发各个等级高发的等各方就四个房间的公交卡军阀割据第三个v领都几点发动机更合适价格肯定就v会给健康的闪光灯就四个等国家发生的广泛空间的大家刚放暑假缸发动机发骚发固定岗双方均是规划黄金富豪就三个客户发送规划都发给谁看见个凤凰于广东省规划局的高发月地方管理商铺旗鼓花果山的孤儿uigfudhfusig ugfuisgfuigfugsufg ugsuifgugfuis不对不对基本上大家看法刚看见的思考和科技部的卡斯本控件卡股份被打开包袱吧vjkjsgkjdbvjugj vjkdbgjksbkgfui个分故为uuiualnjvfsfs很不喜欢就发高烧防护研究所

</body>

</html>

<title>无标题文档</title>

</head>

<frameset rows=”250,*”>

<frame src=”navig.html” name=”navig” scrolling=”no” noresize=”noresize” />

<frame src=”10-14(1).html” name=”10-14″ />

</frameset><noframes></noframes>

</html>

<title>导航页面</title>

</head>

<body>

<center>

<img src=”娃娃.jpg” width=”200″ height=”200″ /><br /><br />

<a href=”10-14(1).html” target=”10-14″>才思妙对娶佳人(1)</a>

        

<a href=”10-14(2).html” target=”10-14″>才思妙对娶佳人(2)</a>

        

<a href=”10-14(3).html” target=”10-14″>六岁神童斗和尚</a>8

<br /><br />

<hr size=”3″ />

<iframe src=”10-14(1).html” name=”10-14″ width=”500″ height=”300″>

</iframe>

</center>

</body>

</html>

<title>源文件</title>

</head>

<body>

<font size=”5″ color=”#33CC66″>精美段落</font>

<img src=”娃娃.jpg” width=”300″ height=”300″ align=left />

    不好苏菲斯i是凤凰随后发生都护发素佛山粉丝哦该哈佛死哦和汉斯佛山覅和海飞丝哈佛ios和覅i哈佛i是哈佛谁 i和地上覅哦哈司法和搜i换肤 id号发ios和覅很舒服皇帝和反思和佛山合肥市凤凰山凤凰山his到哈佛i和司法his哈佛四女i十四id号佛塑饿哦你不是吹牛逆风uowh还算不错不死不少弄iuwewuvbuisvfusvui 不ivudsguisduifgsudgfus粉碎法规沙尘暴苏uisusd福i苏股股份随便擦u胡上次uascbcuguisz ucguicgauicbuaicabuabu不百度撒ubusus不u亅ui随便发丢啊不达uu u盾该u币段催啊匞挂丝绸布i鞍山悲催啊骨刺阿苏u才不素爱吃不说撒u才概不 u盾鼓吹案败诉擦苏擦库存不i啊催啊ui彩塑擦胡uisaui大u葱段各i葬粗俗窜窜酥脆个粗撒个胡次啊刚刚iu出色的干脆撒刚才干撒以饭店和骨髓姑苏此古斯if缩骨功suvusdvusu感到vsubvuisu

</body>

</html>

<title>浮动框架页面</title>

</head>

<body>

<font size=”5″ color=”#FF3300″>浮动框架将会出现在横线下方</font>

<hr size=”2″ />

<iframe src=”10-16(1).html” align=”left” width=”600″ height=”400″ scrolling=”auto” frameborder=”0″>

</iframe>

</body>

</html>

<title>无标题文档</title>

</head>

<body>

<div class=”aa”>

<p>幸福是贫穷中相濡以沫的糕饼</p>

<p>幸福是患难中心心相印的一个眼神</p>

<p>幸福是朋友一个温暖的字条</p>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   font-family: “新宋体”;

   font-size: 18px;

   font-style: oblique;

   line-height: normal;

   font-weight: bold;

   font-variant: normal;

   color: #0066FF;

}

</style>

</head>

<body class=”aa”>

学习HTML并不难

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

div {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   font-weight: bold;

   color: #00CC00;

}

</style>

</head>

<body>

<div>学习HTML并不难</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

h2 {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   color: #330000;

}

p {

   font-family: “Times New Roman”, Times, serif;

   font-size: 14px;

   font-weight: bold;

   color: #00FF00;

}

</style>

</head>

<body>

<p>不啊不批你你还不比吧ui宝宝不鸟被愤怒，都不i一个人覅和水滴hi </p>

<h2>华盛顿hi河山大好vciosd华盛顿你深vi说你是哦 i括号谁弄死面不必把不死</h2>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

p,div{

   font-family:”Times New Roman”, Times, serif;

   font-size:16px;

   font-weight:bold;

   color:#990033;

}

</style>

</head>

<body>

<p>滴水可以穿石，是在告诉我们做事应持之以恒；</p>

<div>大地能载物，是在告诉我们求学要广读博览；</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body p {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   font-weight: bold;

   color: #009900;

}

</style>

</head>

<body>

<p>滴水可以穿石，是在告诉我们做事应持之以恒</p>

<p>大地能载物，是在告诉我们求学要广读博览；</p>

<p> </p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

#aa {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   font-weight: bold;

   color: #000033;

}

</style>

</head>

<body>

<p id=”aa”>滴水可以穿石，是在告诉我们做事应持之以恒</p>

<p>大地能载物，是在告诉我们求学要广读博览；</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #FF6600;

   height: 200px;

   width: 400px;

}

.nn {

   background-color: #CC0000;

   height: 50%;

   width: 50%;

}

</style>

</head>

<body>

<div class=”aa”> </div>

<div class=”nn”> </div>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-image: url(%E5%A8%83%E5%A8%83.jpg);

   height: 200px;

   width: 400px;

}

.nn {

   background-image: url(%E5%A8%83%E5%A8%83.jpg);

   height: 200px;

   width: 400px;

}

</style>

</head>

<body>

<div class=”aa”> </div>

<div class=”nn”> </div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

</style>

<link href=”css.css” rel=”stylesheet” type=”text/css” />

</head>

<body>

<div class=”aa”>此处显示 class “aa” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #00CC00;

   height: 200px;

   width: 400px;

}

</style>

</head>

<body>

<div class=”aa”></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa{

   background-color:#999999;

   width:400px;

   height:200px;

}

.nn{

   background-color:#333333;

   width:400px;

   height:200px;

}

</style>

</head>

<body>

<div class=”aa”></div>

<div class=”nn”></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa{

   background-color:#FF77FF;

   color:#000000;

}

.nn{

   background-color:#FF00FF;

   color:#000000;

}

</style>

</head>

<body>

<span class=”aa”>过去的事情可以不忘记，但一定要放下。</span>

<span class=”nn”>活得轻松，任何事情都做一个最好的打算和一个最坏的打算</span>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa1{

   background-color:#FF77FF;

   color:#000000;

}

.aa2{

   background-color:#0080FF;

   color:#000000;

}

.aa3{

   background-color:#FF77FF;

   color:#000000;

}

.aa4{

   background-color:#0080FF;

   color:#000000;

}

</style>

</head>

<body>

<span class=”aa1″>活得轻松，任何事都做一个最好和最坏的打算</span>

<div class=”aa2″>活得轻松，任何事都做一个最好和最坏的打算</div>

<span class=”aa3″>活得轻松，任何事都做一个最好和最坏的打算</span>

<div class=”aa4″>活得轻松，任何事都做一个最好和最坏的打算</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa{

   background-color:#0080FF;

   color:#000000;

   width:100px;

   height:150px;

   float:left;

}

.nn{

   background-color:#FF77FF;

   color:#000000;

   width:100px;

   height:150px;

   float:right;

}

</style>

</head>

<body>

<div class=”aa”>活得轻松，任何事都做一个最好和最坏的打算</div>

<div class=”nn”>活得轻松，任何事都做一个最好和最坏的打算</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #FF3399;

   position: absolute;

   height: 300px;

   width: 400px;

}

</style>

</head>

<body>

<div class=”aa”>此处显示 class “aa” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #CC33FF;

   position: absolute;

   height: 300px;

   width: 400px;

}

.nn {

   background-color: #3399FF;

   position: absolute;

   height: 300px;

   width: 400px;

   top: 30px;

   right: 26px;

}

</style>

</head>

<body>

<div class=”aa”>

<div class=”nn”>此处显示 class “aa” 的内容</div>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

img {

visibility: hidden;

}

</style>

</head>

<body>

看这幅图片<img src=”娃娃.jpg” width=”110″ height=”150″ alt=”图片” />的显示位置

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   font-family: Arial, Helvetica, sans-serif;

   font-size: 24px;

   font-weight: bold;

   height: 300px;

   width: 400px;

}

body {

   background-color: #009999;

   text-align: center;

}

</style>

</head>

<body>

<div class=”aa”>走向最远的方向–哪怕前路迷茫</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   font-family: Arial, Helvetica, sans-serif;

   font-size: 24px;

   font-weight: bold;

   color: #000000;

   background-color: #CC0000;

   height: 300px;

   width: 400px;

   margin-top: auto;

   margin-right: auto;

   margin-bottom: auto;

   margin-left: auto;

}

</style>

</head>

<body>

<div class=”aa”>走向最远的方向–哪怕前路迷茫</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

background-image: url(file:///E|/网页代码/娃娃.jpg);

background-repeat: repeat;

}

</style>

</head>

<body>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

   background-image: url(file:///E|/网页代码/娃娃.jpg);

   background-repeat: no-repeat;

   background-position: left center;

   background-attachment: scroll;

}

</style>

</head>

<body>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

   background-attachment: fixed;

   background-color: #CC0099;

   background-image: url(file:///E|/网页代码/娃娃.jpg);

   background-repeat: repeat;

   background-position: 50% 50%;

}

</style>

</head>

<body>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   font-family: Arial, Helvetica, sans-serif;

   font-size: 24px;

   line-height: 50px;

   color: #3C0;

   background-color: #FC3;

}

</style>

</head>

<body>

<div class=”aa”>付出不一定有结果，坚持可能失去更多</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

a {

   color: #993300;

}

a:link {

   text-decoration: none;

}

a:visited {

   text-decoration: none;

   color: #006600;

}

a:hover {

   text-decoration: none;

}

a:active {

   text-decoration: none;

   color: #993399;

}

</style>

</head>

<body>

<p><a href=”13-1.html”>请阅读段落1</a>

<p><a href=”13-2.html”>请阅读文段2</a>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #009900;

   float: none;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #00CCCC;

   border-right-color: #00CCCC;

   border-bottom-color: #00CCCC;

   border-left-color: #00CCCC;

}

.nn {

   background-color: #99CCCC;

   float: left;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #999933;

   border-right-color: #999933;

   border-bottom-color: #999933;

   border-left-color: #999933;

}

</style>

</head>

<body>

<div class=”nn”> </div>

<div class=”aa”> </div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #33CC99;

   float: left;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #000;

   border-right-color: #000;

   border-bottom-color: #000;

   border-left-color: #000;

}

.nn {

   background-color: #0F6;

   float: left;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #000;

   border-right-color: #000;

   border-bottom-color: #000;

   border-left-color: #000;

}

</style>

</head>

<body>

<div class=”aa”> </div>

<div class=”nn”> </div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #300;

   float: left;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #000;

   border-right-color: #000;

   border-bottom-color: #000;

   border-left-color: #000;

}

.nn {

   background-color: #6F0;

   float: right;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #000;

   border-right-color: #000;

   border-bottom-color: #000;

   border-left-color: #000;

}

.zz {

   background-color: #C00;

   float: right;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #000;

   border-right-color: #000;

   border-bottom-color: #000;

   border-left-color: #000;

}

.ff {

   background-color: #FF0;

   float: left;

   height: 150px;

   width: 400px;

   border-top-width: 1px;

   border-right-width: 1px;

   border-bottom-width: 1px;

   border-left-width: 1px;

   border-top-color: #000;

   border-right-color: #000;

   border-bottom-color: #000;

   border-left-color: #000;

}

</style>

</head>

<body>

<div class=”aa”>aa </div>

<div class=”ff”>ff </div>

<div class=”nn”>nn </div>

<div class=”zz”>zz</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

img {

float: left;

}

p {

clear: left;

}

</style>

</head>

<body>

<img src=”娃娃.jpg” height=”400″ width=”307″ />

<p>春眠不觉晓，处处闻啼鸟。</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   font-family: “Courier New”, Courier, monospace;

   color: #000;

   background-color: #F30;

   float: left;

   height: auto;

   width: 500px;

}

.nn {

   font-family: “Courier New”, Courier, monospace;

   color: #000;

   float: left;

   height: auto;

   width: 500px;

   background-color: #FF0;

}

.zz {

   font-family: “Courier New”, Courier, monospace;

   color: #000;

   background-color: #3F0;

   float: left;

   height: auto;

   width: 500px;

}

.ff {

   clear: none;

}

</style>

</head>

<body>

<div class=”aa”>aa </div>

<div class=”nn”>nn </div>

<div class=”zz”>zz</div>

        <div class=”ff”>ff </div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   font-family: “Times New Roman”, Times, serif;

   font-size: 16px;

   color: #FF0000;

   background-color: #99CCFF;

   height: 200px;

   width: 200px;

}

</style>

</head>

<body>

<div class=”aa”> 此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容此处显示aa内容 </div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.m {

   background-color: #FF0000;

   height: 80px;

   width: 200px;

}

.nn {

   background-color: #CCCCCC;

   height: 80px;

   width: 200px;

   padding: 20px;

}

</style>

</head>

<body>

<div class=”m”> </div>

<div class=”nn”>此处显示 class “m” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.m {

   background-color: #333333;

   width: 300px;

}

.nn {

   background-color: #CCCCCC;

   width: 300px;

}

p {

   padding: 20%;

   width: 200px;

}

</style>

</head>

<body>

<div class=”m”> <p> 此处显示 class “m” 的内容</p></div>

<div class=”nn”><p>此处显示 class “nn” 的内容</p></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.aa {

   background-color: #333333;

   height: 120px;

   width: 300px;

}

.ss {

   background-color: #CCCCCC;

   height: 120px;

   width: 300px;

   padding-right: 50px;

}

</style>

</head>

<body>

<div class=”aa”>此处显示 class “aa” 的内容</div>

<div class=”ss”>此处显示 class “ss” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.nn {

   background-color: #090;

   height: 120px;

   width: 600px;

   border-top-style: solid;

   border-right-style: solid;

   border-bottom-style: solid;

   border-left-style: solid;

}

.aa {

   background-color: #300;

   height: 120px;

   width: 600px;

   border-top-style: dashed;

   border-right-style: dashed;

   border-bottom-style: dashed;

   border-left-style: dashed;

}

.cc {

   background-color: #6F0;

   height: 120px;

   width: 600px;

   border-top-style: double;

   border-right-style: double;

   border-bottom-style: double;

   border-left-style: double;

}

.bb {

   background-color: #900;

   height: 120px;

   width: 600px;

   border-top-style: groove;

   border-right-style: groove;

   border-bottom-style: groove;

   border-left-style: groove;

}

.zz {

   background-color: #CF0;

   height: 120px;

   width: 600px;

   border-top-style: inset;

   border-right-style: inset;

   border-bottom-style: inset;

   border-left-style: inset;

}

</style>

</head>

<body>

<div class=”aa”>此处显示 class “aa” 的内容</div>

<div class=”bb”>此处显示 class “bb” 的内容</div>

<div class=”cc”>此处显示 class “cc” 的内容</div>

<div class=”nn”>此处显示 class “nn” 的内容</div>

<div class=”zz”>此处显示 class “zz” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

table {

   height: 300px;

   width: 400px;

   border: 1px dashed #00CC00;

}

td {

   border: 1px solid #333333;

}

</style>

</head>

<body>

<table>

<tr>

<td> </td><td> </td><td> </td>

</tr>

<tr>

<td> </td><td> </td><td> </td>

</tr>

<tr>

<td> </td><td> </td><td> </td>

</tr>

<tr>

<td> </td><td> </td><td> </td>

</tr>

</table>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

dog img {

margin: 200px;

}

.nn {

background-color: #00CC00;

}

</style>

</head>

<body>

<div class=”dog img”>一个使用<img src=”娃娃.jpg” height=”400″ width=”300″ />margin属性的例子</div>

<div class=”nn”>一个使用<img src=”娃娃.jpg” height=”400″ width=”300″ />mergin属性的例子，</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.m {

   background-color: #9933CC;

   height: 300px;

   width: 400px;

}

.nn {

   background-color: #333333;

   height: 120px;

   width: 200px;

   margin-top: 20px;

   margin-right: 40px;

   margin-bottom: 20px;

   margin-left: 40px;

}

</style>

</head>

<body>

<div class=”m”>此处显示 class “m” 的内容</div>

<div class=”nn”>此处显示 class “nn” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #00CCFF;

   height: 200px;

   width: 400px;

   margin-bottom: 20px;

}

.cc {

   background-color: #CC0066;

   height: 200px;

   width: 400px;

   margin-top: 20px;

}

</style>

</head>

<body>

<div class=”ma”>此处显示 class “ma” 的内容</div>

<div class=”cc”>此处显示 class “cc” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #CC00FF;

   height: 120px;

   width: 300px;

   margin-bottom: 150px;

}

.cc {

   background-color: #006699;

   height: 120px;

   width: 300px;

   margin-top: -30px;

}

</style>

</head>

<body>

<div class=”ma”>此处显示 class “ma” 的内容</div>

<div class=”cc”>此处显示 class “cc” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #66CC99;

   height: 200px;

   width: 80px;

   margin-right: 80px;

   float: left;

}

.cc {

   background-color: #CC3300;

   height: 200px;

   width: 80px;

   margin-left: 80px;

   float: left;

}

</style>

</head>

<body>

<div class=”ma”>此处显示 class “ma” 的内容</div>

<div class=”cc”>此处显示 class “cc” 的内容</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #003300;

   height: 300px;

   width: 400px;

   padding-top: 50px;

   padding-right: 0px;

   padding-bottom: 0px;

   padding-left: 20px;

}

.cc {

   background-color: #993333;

   margin: 0px;

   height: 150px;

   width: 200px;

}

</style>

</head>

<body>

<div class=”ma”>

<div class=”cc”>此处显示 class “ma” 的内容</div>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #339900;

   padding: 0px;

   height: 300px;

   width: 400px;

}

.cc {

   background-color: #CC3333;

   height: 150px;

   width: 200px;

   margin-top: 50px;

   margin-right: 0px;

   margin-bottom: 0px;

   margin-left: 50px;

}

</style>

</head>

<body>

<div class=”ma”>

<div class=”cc”>此处显示 class “ma” 的内容</div>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #0099FF;

   height: 300px;

   width: 400px;

   padding-top: 50px;

   padding-right: 0px;

   padding-bottom: 0px;

   padding-left: 100px;

}

.cc {

   background-color: #CC0066;

   height: 100px;

   width: 200px;

   margin-top: -100px;

   margin-right: 0px;

   margin-bottom: 0px;

   margin-left: 100px;

}

</style>

</head>

<body>

<div class=”ma”>

<div class=”cc”>此处显示 class “ma” 的内容</div>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #CC0000;

   height: 150px;

   width: 300px;

   overflow: scroll;

}

.cc {

   background-color: #009966;

   height: 150px;

   width: 300px;

   overflow: hidden;

}

</style>

</head>

<body>

<div class=”ma”>刚好价格会与和谷歌红叶谷和预估由因故与和预估由和预估由规格房地产与vgu月份姑爷爷光伏业余应付依附于非预定的大屠杀的突然一天撒问题仍需要一听音乐小餐厅歹徒刺该妇女</div>

<div class=”cc”>钓鱼台现场麢韩奎vgv 居于与vhjvcvhchujvfhgfctcty日发送发现曾经因此与菲亚特与发一条地铁一次出太阳的天然形成统一多用途车vytcyt他的头一天此贴天打印题词</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

background-color: #FF9797;

}

p {

text-indent: 2em;

}

</style>

</head>

<body>

<p>就会送死吧百并不u贵啊股份笔记爱哦发不喝酒不发生宝宝说比较少部分击败本基本看法吧不开就随便放空间将封闭空间并发送就随便就方便那就随便发空白烧开不宝宝健康随便放空间把数据库宝宝社保卡将法宝八宝山警方把伤口就爆发发送不放假社保卡将发送健康就方便说尽快把飞机上看宝宝发烧空间不分开就随便比较少部分就快睡吧</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

   background-color: #00CCCC;

}

p:first-letter {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   color: #FF0000;

}

</style>

</head>

<body>

<p>就会送死吧百并不u贵啊股份笔记爱哦发不喝酒不发生宝宝说比较少部分击败本基本看法吧不开就随便放空间将封闭空间并发送就随便就方便那就随便发空白烧开不宝宝健康随便放空间把数据库宝宝社保卡将法宝八宝山警方把伤口就爆发发送不放假社保卡将发送健康就方便说尽快把飞机上看宝宝发烧空间不分开就随便比较少部分就快睡吧</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

   background-color: #3300CC;

}

p {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   color: #00CCFF;

   text-align: center;

   text-indent: 2em;

}

</style>

</head>

<body>

<p>山水宝宝吧包括基本款笔记本包括基本上空间爆发并加快开发就开始崩溃崩溃就包括包括基本就不见包括基本就包括包括将包括本空间吧健康不健康不健康吧鲍俊凯包括基本就看吧包括本基本就看吧包括将包括不健康把健康不健康不健康吧健康包括包括本基本就看吧健康不健康不健康吧健康健康笔记本健康不健康不健康包括基本就不见看不健康宝宝就不健康不健康健康不健康笔记本健康笔记本健康不健康不健康不健康健康不健康不就不健康把健康不健康不健康吧就笔记本健康不健康不健康不健康不就不健康不健康吧笔记本基本就看看笔记本健康不健康包括基本包括基本就包括包就不健康不加班不加班笔记本就不健康不健康包括基本健康吧不包括将包括宝宝健康包括基本健康健康包括基本空间</p>

<p>笔记本看不见宝宝就把健康不健康不健康吧健康不仅仅把健康包括基本不变包括基本就不见看不见不健康笔记本健康包括基本就不见看笔记本你不健康包括基本就包括吧家宝宝就笔记本就不健康不健康本控件宝宝将笔记本包括基本健康吧看吧包就包括基本就不见看不健康包就笔记本就看不见笔记本健康笔记本健康不健康笔记本空间包括基本包就包括基本健康吧就看不见宝宝就看不见不健康不就不健康笔记本就看不见吧基本健康不健康包括基本就不见本控件把健康不健康不健康吧就笔记本就开不开并不具备笔记本就不就不健康包括基本笔记本就看不见笔记本基本健康吧不健康笔记本就包括本基本就看吧笔记本基本就包括不健康不健康包括基本就包括基本健康笔记本空间笔记本健康不健康笔记本基本健康包括基本健康不健康不健康吧基本健康不健康不健康吧包括基本健康吧包就笔记本就不就不健康包括基本健康笔记本基本健康包括基本就肩并肩笔记本就不就不健康包括基本空间不健康不健康吧包括将包括基本健康把健康不健康不健康吧健康就不就不就不健康吧</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

body {

background-color: #CC3399;

}

img {

vertical-align: top;

}

</style>

</head>

<body>

宝宝还包括基本不健康不包括基本笔记本基本<img src=”娃娃.jpg” height=”400″ width=”300″ />不喝酒姑姑家贵股ui规划贵不i姑姑本关于宝宝爸爸不不不ui并不不必u不i不必宝宝和基本被爆菊花爸爸看见宝宝。

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

div {

   width: 500px;

}

img {

   margin: 10px;

   float: left;

}

</style>

</head>

<body>

<div>宝宝还包括基本不健康不包括基本笔记本基本<img src=”娃娃.jpg” height=”400″ width=”300″ />不喝酒姑姑家贵股ui规划贵不i姑姑本关于宝宝爸爸不不不ui并不不必u不i不必宝宝和基本被爆菊花爸爸看见宝宝。</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

p {

   text-indent: 0px;

}

img {

   float: left;

   margin-top: 5px;

   margin-right: 2px;

   margin-bottom: 5px;

   margin-left: 0px;

}

</style>

</head>

<body>

<p>

<img src=”娃娃.jpg” height=”400″ width=”300″ />宝宝还包括基本不健康不包括基本笔记本基本不喝酒姑姑家贵股ui规划贵不i姑姑本关于宝宝爸爸不不不ui并不不必u不i不必宝宝和基本被爆菊花爸爸看见宝宝。</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

p {

   font-family: “Times New Roman”, Times, serif;

   font-size: 14px;

   line-height: 30px;

   color: #0066FF;

   background-color: #99FF99;

}

</style>

</head>

<body>

<p>

笔记本看不见宝宝就把健康不健康不健康吧健康不仅仅把健康包括基本不变包括基本就不见看不见不健康笔记本健康包括基本就不见看笔记本你不健康包括基本就包括吧家宝宝就笔记本就不健康不健康本控件宝宝将笔记本包括基本健康吧看吧包就包括基本就不见看不健康包就笔记本就看不见笔记本健康笔记本健康不健康笔记本空间包括基本包就包括基本健康吧就看不见宝宝就看不见不健康不就不健康笔记本就看不见吧基本健康不健康包括基本就不见本控件把健康不健康不健康吧就笔记本就开不开并不具备笔记本就不就不健康包括基本笔记本就看不见笔记本基本健康吧不健康笔记本就包括本基本就看吧笔记本基本就包括不健康不健康包括基本就包括基本健康笔记本空间笔记本健康不健康笔记本基本健康包括基本健康不健康不健康吧基本健康不健康不健康吧包括基本健康吧包就笔记本就不就不健康包括基本健康笔记本基本健康包括基本就肩并肩笔记本就不就不健康包括基本空间不健康不健康吧包括将包括基本健康把健康不健康不健康吧健康就不就不就不健康吧</p>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   font-size: 14px;

   line-height: 30px;

   color: #CCCC00;

   background-color: #993366;

}

.cc {

   color: #00FFFF;

   padding: 0px;

}

</style>

</head>

<body>

<div class=”ma”>

笔记本看不见宝宝就把健康不健康不健康吧健康不仅仅把健康包括基本不变包括基本就不见看不见不健康笔记本健康包括基本就不见看笔记本你不健康包括基本就包括吧家宝宝就笔记本就不健康不健康本控件宝宝将笔记本包括基本健康吧看吧包就包括基本就不见看不健康包就笔记本就看不见笔记本健康笔记本健康不健康笔记本空间包括基本包就包括基本健康吧就看不见宝宝就看不见不健康不就

<div class=”cc”>

不健康笔记本就看不见吧基本健康不健康包括基本就不见本控件把健康不健康不健康吧就笔记本就开不开并不具备笔记本就不就不健康包括基本笔记本就看不见笔记本基本健康吧不健康笔记本就包括本基本就看吧笔记本基本就包括不健康不健康包括基本就包括基本健康笔记本空间笔记本健康不健康笔记本基本健康包括基本健康不健康不健康吧基本健康不健康不健康吧包括基本健康吧包就笔记本就不就不健康包括基本健康笔记本基本健康包括基本就肩并肩笔记本就不就不健康包括基本空间不健康不健康吧包括将包括基本健康把健康不健康不健康吧健康就不就不就不健康吧

</div>

</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   font-size: 14px;

   line-height: 150px;

   color: #006699;

   background-color: #FF99FF;

   text-align: center;

   height: 300px;

   width: 600px;

   border: thick solid #003366;

}

</style>

</head>

<body>

<div class=”ma”>不健康笔记本就看不见吧基本健康不健康包括基本就不见本控件把健康不健康不健康吧就笔记本就开不开并不具备笔记本就不就不健康包</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   font-size: 14px;

   line-height: 300px;

   color: #0000CC;

   background-color: #99CC66;

   letter-spacing: 1em;

   height: 300px;

   width: 600px;

   text-align: center;

}

</style>

</head>

<body>

<div class=”ma”>不健康笔记本就看不见吧基本健康不健</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   font-size: 14px;

   line-height: 300px;

   color: #0099CC;

   background-color: #CC00FF;

   text-align: center;

   word-spacing: 20em;

   height: 300px;

   width: 600px;

}

</style>

</head>

<body>

<div class=”ma”>Do ong thing at a

time,and do well.</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

Div {

   background-color: #339966;

   text-align: center;

   padding: 60px;

   width: 400px;

}

img {

   height: 120px;

   width: 160px;

}

</style>

</head>

<body>

<Div><img src=”娃娃.jpg” /></Div></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

div {

   background-color: #CC33CC;

   text-align: center;

   height: 300px;

   width: 400px;

}

img {

   height: 120px;

   width: 160px;

   position: relative;

   top: 50%;

   margin-top: -60px;

}

</style>

</head>

<body>

<div><img src=”娃娃.jpg” /></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-image: url(%E5%A8%83%E5%A8%83.jpg);

   background-repeat: no-repeat;

   background-position: center center;

   height: 300px;

   width: 400px;

   border: thin solid #00CC66;

}

</style>

</head>

<body>

<div class=”ma”> </div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   font-family: “Times New Roman”, Times, serif;

   color: #003366;

   text-decoration: underline;

}

.cc {

   font-family: “宋体”;

   color: #0033CC;

   text-decoration: overline;

}

.nn {

   font-family: “新宋体”;

   color: #990066;

   text-decoration: blink;

}

</style>

</head>

<body>

<div class=”cc”>户数回复胡说户数哈萨克回复isdhfuhs</div>

<div class=”ma”>代表vudhbsduhfuU盾会回复苏德华</div>

<div class=”nn”>iniini哄好i戹气味儿hi和你说吧</div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   background-color: #99CCCC;

   height: 300px;

   width: 400px;

}

a:link {

   color: #CC3333;

}

</style>

</head>

<body>

<div class=”ma”><a href=”15-16.html”>孤寡股份公司姑姑是个胡瓜故事光伏股</a></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

a:link {

   color: #006600;

}

a:hover {

   color: #CC33CC;

   font-size: 18px;

}

</style>

</head>

<body>

<div><a href=”15-16.html”>还是哥哥是梵蒂冈</a></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

a:link {

   color: #006600;

}

a:visited {

   color: #999966;

}

a:hover {

   color: #333399;

   font-size: 18px;

}

a:active {

   color: #FF0066;

}

</style>

</head>

<body>

<div><a href=”15-16.html”>年度和规划的司痐</a></div>

</body>

</html>

<title>无标题文档</title>

<style type=”text/css”>

.ma {

   height: 100px;

   width: 400px;

   cursor: help;

}

.cc {

   height: 100px;

   width: 400px;

   cursor: wait;

}

.nn {

   height: 200px;

   width: 400px;

   cursor: text;

}

</style>

</head>

<body>

<div class=”cc”>撒回复即可恢复京哈圣诞节</div>

<div class=”ma”>看到家分公司登记会计师的时刻</div>

<div class=”nn”>你的年龄的借口叫大家</div>

</body>

</html>

<title>右缩进</title>

</head>

<body>

下马饮君酒，问君何所之。

<blockquote>君言不得意，归卧南山陲。</blockquote>

<blockquote><blockquote>但去莫复问，白云无尽时。</blockquote></blockquote>

</body>

</html>

<title>标题文字,字体显示效果</title>

</head>

<body>

<h1>书是精神食粮，它重塑了我的灵魂</h1>

<h2 align=”center”>书是精神食粮，它重塑了我的灵魂</h2>

<h3 align=”left”>书是精神食粮，它重塑了我的灵魂</h3>

<h4 align=”right”>书是精神食粮，它重塑了我的灵魂</h4>

<h5 align=”justify”>书是精神食粮，它重塑了我的灵魂</h5>

<h6>书是精神食粮，它重塑了我的灵魂</h6>

<font face=”华文彩云” size=”+1″ color=”#CC3300″>幸福是父亲一次粗糙的抚摸</font><br />

<font face=”黑体” size=”+2″ color=”#3366CC”>幸福是朋友一次温馨的字条</font><br />

<font face=”华文楷体” size=”+4″ color=”#FF3366″>幸福是母亲声温柔的叮咛</font><br />

<font face=”宋体” size=”-2″ color=”#FF3399″

>幸福是老师一次亲切的问候</font>

</body>

</html>

<title>表格的嵌套</title>

</head>

<body>

<table width=”500″ height=”250″ border=”1″ cellspacing=”0″ align=”center”>

<thead bgcolor=”#33FFCC”>

<tr height=”10″>

<td width=”160″>  </td>

<td width=”400″>  </td>

</tr></thead>

<tbody>

<tr valign=”top” height=”200″>

<td width=”160″ align=”center”>

<table width=”135″ height=”150″ border=”1″ cellspacing=”0″ bgcolor=”#FFCC33″>

<tr>

<td>添加链接</td>

</tr>

<tr>

<td>添加链接</td>

</tr>

<tr>

<td>添加链接</td>

</tr>

<tr>

<td>添加链接</td>

</tr>

<tr>

<td>添加链接</td>

</tr>

</table>

</td>

<td width=”400″ height=”200″ background=”娃娃.jpg”>

<table width=”350″ height=”140″ border=”1″ bordercolor=”#FF0099″ cellspacing=”3″ cellpadding=”5″>

<tr>

<td>第一季度</td>

<td>第二季度</td>

</tr>

<tr>

<td>第三季度</td>

<td>第四季度</td>

</tr>

</table>

</td>

</tr>

</tbody>

<tfoot bgcolor=”#99FFFF”>

<tr align=”center”>

<td height=”30″ colspan=”2″><font color=”#00FF00″>荣智技术学院</font>

</td></tr>

</tfoot>

</table>

</body>

</html>

<title>表格基本结构</title>

</head>

<body>

<table border=”2″ cellpadding=”1″ cellspacing=”1″>

<tr><th>语文</th><th>数学</th><th>英语</th>

<tr><td>90</td><td>78</td><td>89</td>

</table>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>播放音乐</title>

</head>

<body>

<embed src=”梁山伯与朱丽叶 – 曹格.mp3″ autostart=true loop=true width=”200″ height=”200″>

现在让我们一起来听music！

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>插入图像</title>

</head>

<body>

<h3>大鱼吃小鱼</h3>

    看着海底凶神恶煞的鱼类，身为小鱼的你知道该怎么做了吗？<br />

<img src=”娃娃.jpg” align=”bottom” alt=”娃娃” border=”5″ />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>单选按钮</title>

</head>

<body>

<h2>测试题</h2>

<form action=”deal.asp” method=”post” name=”example”>

<hr />以下描述，哪个是你认为自己有的缺点<hr />

<input type=”radio” name=”text” value=”answer1″ />没有耐心<br />

<input type=”radio” name=”text” value=”answer2″ />欠缺细心<br />

<input type=”radio” name=”text” value=”answer3″ />没有主见<br />

<input type=”radio” name=”text” value=”answer4″ />欠缺风情

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置单元格属性</title>

</head>

<body>

<table border=”1″ bordercolor=”#009966″ cellpadding=”10″ cellspacing=”0″ height=”250″ width=”550″>

<caption>成绩单</caption>

<tr>

<td width=”50″></td>

<td colspan=”4″ align=”center” bgcolor=”#330033″>课程</td>

</tr>

<tr>

<td align=”center”>姓名</td><td align=”left”>语文</td><td align=”right”>数学</td><td valign=”top”>英语</td><td valign=”bottom”>专业课</td>

</tr>

<tr>

<td bordercolordark=”#FF0000″>李慧</td><td bordercolorlight=”#33CC33″>94</td><td>98</td><td>90</td><td>92</td>

</tr>

<tr>

<td>郭小虎</td><td>89</td><td>91</td><td>87</td><td>99</td>

</tr>

<tr>

<td>王筝</td><td>85</td><td>95</td><td>92</td><td>90</td>

</tr></table>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>文字等宽效果</title>

</head>

<body>

在下面将显示两段英文效果，突出等宽文字与英文文字的效果。<br /><br />

普通英文效果<br />

HTML is the lingua franca for pulishing hypertext on the world wide web.<br /><br />

等宽文字效果<br />

<code>HTML is the lingua franca for pulishing hypertext on the world wide web.</code><br /><br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>段落标记</title>

</head>

<body>

<p align=center>

活动规则<p>1.”知识大富翁“分四个阶段进行，每个阶段按积分排名获取阶段大奖每日根据用户大体情况抽取20名幸运观众。<p>2.可以参加本次活动的用户为：至少绑定了一项参加本次活动的付费业务的用户，卡用户及全港通用户除外，</p>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置滚动文字</title>

</head>

<body>

<marquee behavior=”alternate” bgcolor=”#33FF00″ direction=”up” scrollamount=”15″>

<font face=”楷体” color=”#ff6600″ size=”4″>当狂风在你耳边呼啸而过，你只当他微风拂面。当暴雨在你眼前倾斜时，你只当它屋檐滴雨。当闪电在你头顶肆虐时，你只当它萤火流逝。人，决不能在逆境面前屈服。</font></marquee>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>连接到其他页面的锚点</title>

</head>

<body>

<p><a name=”top”></a>牡丹以它的雍容华贵而闻名,其可分为五种类型，分别为：</p>

<a href=”为页面链接锚点.html#type1″>直立型</a><br />

<a href=”为页面链接锚点.html#type2″>疏散型</a><br />

<a href=”为页面链接锚点.html#type3″>开张型</a><br />

<a href=”为页面链接锚点.html#type4″>矮生型</a><br />

<a href=”为页面链接锚点.html#type5″>独立型</a><br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>列表的简化</title>

</head>

<body>

<font size=”5″ color=”#CC0033″>专业名词解释</font><br /><br />

<dl compact=”compact”>

<dt>html<dd>超文本标记语言，用于描述网页文档的一种标记语言。

<dt>css<dd>级联样式表，用来进行网页风格设计。

<dt>div<dd>div元素是用来为html文档内大块的文档结构和背景的元素。

</dl>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>列表行属性</title>

</head>

<body>

<table border=”1″ bordercolor=”#FF0000″ cellpadding=”5″>

<caption valign=”bottom”>我国著名词人——白居易</caption>

<tr align=”center” bgcolor=”#33CC00″>

<td>字号</td><td>字天乐</td>

</tr>

<tr align=”left” bgcolor=”#FF3333″>

<td>著作</td><td>《长恨歌》，《琵琶行》，《长相思》，《忆江南》</td>

</tr>

<tr align=”right” bgcolor=”#000099″>

<td>家庭出身</td><td>官宦之家，巩县县令白噗孙、彭城县令白季庚之子</td>

</tr>

</table>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>超链接的其他设置</title>

</head>

<body>

<font size=”+2″>

<a href=”mailto:intel@qq.com” title=”读者你好”>给我发邮件</a><br />

<a href=”ftp://101.22.25.11″ title=”欢迎进入FTP”>连接FTP服务器</a><br />

<a href=”telnet://101.22.25.11″ title=”欢迎进入telnet服务器”>连接telnet服务器</a></font>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>嵌套分割窗口</title>

</head>

<frameset rows=”350,700″>

<frame src=”file:///D|/dreamweaver/Adobe Dreamweaver CS6/UntitledFrame-4″ />

<frameset cols=”300,300,300″>

<frame src=”file:///D|/dreamweaver/Adobe Dreamweaver CS6/UntitledFrame-5″ />

<frame src=”file:///D|/dreamweaver/Adobe Dreamweaver CS6/UntitledFrame-6″ />

<frame src=”file:///D|/dreamweaver/Adobe Dreamweaver CS6/UntitledFrame-7″ />

</frameset>

</frameset><noframes></noframes>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>居中对齐</title>

</head>

<body>

<center>

<font size=”+2″>《开始懂了》</font><br /><br />

我竟然没有调头<br />

最残忍那一刻<br />

静静看着你<br />

一点都不像我<br />

原来人会变得温柔<br />

是透彻的懂了<br />

爱情是流动的<br />

不由人的<br />

何必激动着要理由<br />

相信你只是怕伤害我<br />

不是骗我<br />

很爱过谁会舍得<br />

把我的梦摇醒了<br />

宣布幸福不会来了<br />

用心酸微笑去原谅了<br />

也翻越了<br />

有昨天还是好的<br />

但明天是自己的<br />

开始懂了快乐是选择<br />

</center>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置多媒体文件</title>

</head>

<body>

在页面中嵌入多媒体：<br />

<embed src=”少女时代.avi” width=”300″ height=”200″ autostart=False></embed>

<embed src=”少女时代.avi” width=”300″ height=”200″ autostart=True></embed>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>取消文字换行</title>

</head>

<body>

<p>一棵小草，也许永远不能成为参天大树，但它可能做最绿最坚强的小草；一滴水，也许永远不能向长江大河一样奔腾，但它可以成为所有水中最纯的那一滴。</p>

<nobr><p>一棵小草，也许永远不能成为参天大树，但它可能做最绿最坚强的小草；一滴水，也许永远不能向长江大河一样奔腾，但它可以成为所有水中最纯的那一滴。</p></nobr>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置上下标</title>

</head>

<body>

在方程式中应用上标:<br />

X<sup>2</sup>-Y<sup>2</sup>=25<br />

在方程式中应用下标:<br />

X<sub>2</sub>-Y<sub>2</sub>=36<br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置图像热区连接</title>

</head>

<body>

<h3>娃娃</h3>

<center>

<img src=”娃娃.jpg” height=”300″ usemap=”#wawa” hspace=”10″ border=”0″ />

<map name=”wawa” id=”wawa”>

<area shape=”rect” coords=”70,67,77,71″ href=”#” />

<area shape=”rect” coords=”72,62,107,88″ href=”#yanjing” />

<area shape=”circle” coords=”70,127,3″ href=”#” />

<area shape=”circle” coords=”68,125,2″ href=”#” />

<area shape=”circle” coords=”66,108,2″ href=”#” />

<area shape=”circle” coords=”86,105,6″ href=”#” />

<area shape=”circle” coords=”66,108,10″ href=”#bizi” />

<area shape=”poly” coords=”93,135,94,129,95,137,83,139,73,139,68,131,67,120,77,120,79,120,88,122″ href=”#zuiba” />

</map>

<br /><br />

</center>

<hr color=”#990000″ size=”3″ /><br /><br />

    <a name=”yanjing”>眼睛</a><br /><br /><br />

<hr color=”#990000″ size=”3″ /><br /><br />

    <a name=”zuiba”>嘴巴</a><br /><br /><br />

<hr color=”#990000″ size=”3″ /><br /><br />

    <a name=”bizi”>鼻子</a><br /><br /><br />

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置无序列表</title>

</head>

<body>

<font size=”5″>网页中的元素有：</font><br />

<ul type=”circle”>

<li>文本文字

<li>超链接

<li>图像

<li>表格

<li>表单

<li>多媒体

<li>框架

</ul>

<hr color=”#33FF33″ size=”2″ />

<font size=”5″>计算机编程语言：</font><br />

<ul type=”disc”>

<li>汇编

<li>C

<li>C++

<li>java

<li>c#

</ul>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>书签链接</title>

</head>

<body>

<h3>古代诗词</h3>

<pre> 如果想学习诗词，只需单击下面对应的是人的名字即可</pre><br /><br />

<a href=”#秦观”>秦观</a><br />

<a href=”#李白”>李白</a><br />

<a href=”#杜甫”>杜甫</a><br />

<a href=”#王维”>王维</a><br />

<a href=”#孟浩然”>孟浩然</a><br />

<hr size=”3″ />

<hr size=”3″ />

<a name=”秦观”>减字木兰花天涯旧恨</a><br />

天涯旧恨，独自凄凉人不问。欲见回肠，断尽金炉小篆乡。<br />

黛蛾长敛，任是东风吹不展。困椅危楼，过尽飞鸿字字愁。<br /><br />

<hr size=”2″ />

<a name=”李白”>春思</a><br />

燕草如碧丝，秦桑低绿枝。<br />

当君怀归日，是妾断肠时。<br />

春风不相识，何事入罗伟。<br /><br />

<hr size=”2″ />

<a name=”杜甫”>佳人</a><br />

绝代有佳人，幽居在空谷。<br />

自云良家女，零落依草木。<br />

关中昔丧乱，兄弟遭杀戮。<br /><br />

<hr size=”2″ />

<a name=”王维”>送别</a><br />

下马饮君酒，问君何所之。<br />

君言不得意，归卧南山陲。<br />

但去莫复言，白云无尽时。<br /><br />

<hr size=”2″ />

<a name=”孟浩然”>过故人庄</a><br />

故人具鸡历，邀我至田家。<br /><br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>书签外连接</title>

</head>

<body>

<H3>古代诗词</H3>

<a href=”书签链接.html#秦观”>秦观</a><br />

<a href=”书签链接.html#李白”>李白</a><br />

<a href=”书签链接.html#杜甫”>杜甫</a><br />

<a href=”书签链接.html#王维”>王维</a><br />

<a href=”书签链接.html#孟浩然”>孟浩然</a><br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>输入空格符号</title>

</head>

<body>

在文字中间不使用空格符号，直接输入6个半角空格效果：<br />

下马饮君酒，      问君何所之。<br />

君言不得意，      归卧南山陲。<br />

但去莫复问，      白云无尽时。<br />

使用空格符号效果：<br />

下马饮君酒，      问君何所之。<br />

君言不得意，      归卧南山陲。<br />

但去莫复问，      白云无尽时。<br />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>无标题文档</title>

</head>

<body>

<form>

<input type=”button” name=”Test” value=”测试” onmousedown=alert(“我被激活了”) />

<input type=”button” name=”Test” value=”测试2″ onmousemove=alert(“我被激活了”) />

<input type=”button” name=”Test” value=”测试3″ onmouseover=alert(“我被激活了”) />

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>水平线设置</title>

</head>

<body>

<font color=”#FFFF00″ align=left>左对齐</font><br />

<hr color=”#FFFF00″ align=”left” width=”40″ />

<font color=”#339933″ align=center>居中对齐</font><br />

<hr color=”#339966″ align=”center” width=”40″ />

<font color=”#FF0000″ align=right>右对齐</font><br />

<hr color=”#FF0000″ align=”right” width=”40″ />

<P>去掉阴影</P>

<hr width=”40″ noshade=”noshade” />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>添加背景音乐</title>

</head>

<body>

<bgsound src=”张敬轩 – 酷爱.mp3″ loop=”2″ />

<h3 align=”center”>趵突泉</h3>

<p>趵突泉位于济南市中心，趵突泉南路和乐源大街中段，南靠千佛山东临泉城广场。</p>

<p>

<center>

<img src=”娃娃.jpg” height=”150″ />

</center><br />

趵突泉越来越举世瞩目，有由济南不由趵突泉，不成游也。

</p></body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>添加表格</title>

</head>

<body>

<h3>添加一个两行两列的表格<h3><br /><br />

<table background=”娃娃.jpg” border=”1″ bordercolor=”#CC0099″ cellpadding=”10″ cellspacing=”3″>

<caption>计算机语言</caption>

<tr>

<td>汇编语言  </td>

<td>c语言  </td>

</tr>

<tr>

<td>java语言  </td>

<td>c#语言  </td>

</tr>

</table>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>添加复选框</title>

</head>

<body>

选择你的业余爱好：

<form name=”example” action=”deal.asp” method=”post”>

<input type=”checkbox” name=”text” value=”A2″ checked=”checked” />看书

<input type=”checkbox” name=”text” value=”A3″ />上网

<input type=”checkbox” name=”text” value=”A1″ />逛街

<input type=”checkbox” name=”text” value=”A4″ />打球

<br />

<input type=”checkbox” name=”text” value=”A5″ />听歌

<input type=”checkbox” name=”text” value=”A6″ />旅游

<input type=”checkbox” name=”text” value=”A7″ checked=”checked” />聊天

<input type=”checkbox” name=”text” value=”A8″ />游泳

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>在表单中添加普通按钮</title>

</head>

<body>

<form name=”example” action=”deal.asp” method=”post”>

<input type=”button” value=”普通按钮” name=”button1″ />

<input type=”button” value=”关闭当前窗口” name=”close” onclick=”window.close()” />

<input type=”button” name=”open” value=”打开窗口” onclick=”window.open()” />

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>添加图像域</title>

</head>

<body>

用户登录：

<form action=”land.asp” method=”post” name=”example”>

<p>

用户名：<input type=”text” name=”name” />

</p>

<p>

密码：<input type=”password” name=”password” size=”20″ />

</p>

<input type=”image” src=”娃娃.jpg” name=”yes” width=”100″ height=”20″ />

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>添加文件域</title>

</head>

<body>

添加到页面上的文件域：

<form>

输入要上传文件的路径：<input type=”file” name=”picture” />

<p>

<input type=”submit” name=”yes” value=”确定” />

     

<input type=”reset” name=”no” value=”取消” />

</p>

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>添加文字文段</title>

</head>

<body>

添加下面的数据：

<form action=”land.asp” method=”post” name=”example”>

姓名：<input type=”text” name=”xingming” size=”15″ /><br />

年龄：<input type=”text” name=”yearsold” size=”15″ maxlength=”2″ /><br />

学历：<input type=”text” name=”xueli” size=”15″ maxlength=”5″ value=”本科” />默认出现的是本科。<br />

<input type=”hidden” name=”page_id” value=”example” />本控件为隐藏域

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>为页面添加锚点</title>

</head>

<body>

<pre>

<p><a name=”top”></a>牡丹以它的雍容华贵而闻名,其可分为五种类型，分别为：</p>

<a href=”#type1″>直立型</a><br />

<a href=”#type2″>疏散型</a><br />

<a href=”#type3″>开张型</a><br />

<a href=”#type4″>矮生型</a><br />

<a href=”#type5″>独立型</a><br />

<p>

<a name=”type1″>1.直立型</a> <a href=”#top”>返回</a><br />

枝条直立挺拔而较高，分布紧凑，展开角度小。

</p>

<p>

<a name=”type2″>2.疏散性</a> <a href=”#top”>返回</a><br />

枝条多疏散弯曲向四周伸展，株幅大于株高。</p>

<p>

<a name=”type3″>3.开张型</a> <a href=”#top”>返回</a><br />

枝条生长健壮挺拔，向四周邪神开张。</p>

<p>

<a name=”type4″>4.矮生型</a> <a href=”#top”>返回</a><br />

枝条生长缓慢，节间短而叶密。</p>

<p>

<a name=”type5″>5.独立性</a> <a href=”#top”>返回</a><br />

多为人工培植的艺术造型。</p>

</pre>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>无标题文档</title>

</head>

<body>

<form>

<input type=”text” name=”Test” value=”测试” onchange=alert(“我被改变了”) />

<input type=”text” name=”Test” value=”测试” onselect=alert(“我被选中了”) />

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>设置保留原始排版方式</title>

</head>

<body>

红豆生南国，当春乃发生。

愿君多采撷，此物最相思。

<pre>

红豆生南国，当春乃发生。

愿君多采撷，此物最相思。

</pre>

</body>

</html>

<head>

<meta http-equiv=”ContentType” content=”text/html; charset=utf-8″ />

<title>文字的字体样式</title>

<style type=”text/css”>

<!–

–>

</style>

</head>

<body>

<b>黑体字</b>

<p><i>斜体字</i>

<p><u>加下划线</u>

<p><big>大型字体</big>

<p><small>小型字体</small>

</p>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>文字删除线</title>

</head>

<body>

<p>如果你是一棵树，就洒下一片阴凉</p>

<s>如果你是一泓清泉，就滋润一方土地</s><br /><br />

<strike>如果你是一颗星星，就点缀一角星空</strike>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>文字的颜色</title>

</head>

<body bgcolor=”#000000″>

<center>

<font color=”#ff0000″>文字颜色</font>

<br />

<font color=”#00ff00″>文字颜色</font><br />

<font color=”#0000cc”>文字颜色</font><br />

<font color=”red”>文字颜色</font><br />

<font color=”blue”>文字颜色</font><br />

</center>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>无标题文档</title>

<style type=”text/css”>

body {

   text-align: center;

   display: inline;

   visibility: visible;

}

</style>

</head>

<body>

设置内容控制属性

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>无标题文档</title>

<style type=”text/css”>

a {

   font-family: “Times New Roman”, Times, serif;

   font-size: 24px;

   background-color: #FF8080;

   background-image: url(file:///E|/网页代码/娃娃.jpg);

}

</style>

</head>

<body>

<a href=”习题1.html”>当生活给你一百个理由哭泣时，你就拿一千个理由笑给他。</a>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>无标题文档</title>

<style type=”text/css”>

li {

list-style-position: outside;

list-style-type: circle;

}

</style>

</head>

<body>

<ul>

<li>第一张</li>

<li>第二章</li>

<li>第三章</li>

</ul>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>习题8.7</title>

</head>

<body>

<table align=”center” width=”400″ height=”45″ background=”娃娃.jpg” bgcolor=”#0000FF” border=”1″>

<caption>某班同学的学习成绩</caption>

<tr align=”center”>

<td>  </td><td colspan=”4″ align=”center”>综合科目</td>

</tr>

<tr align=”center”>

<td>姓名</td><td>语文</td><td>数学</td><td>英语</td><td>专业课</td>

</tr>

<tr align=”right”>

<td>唐凌</td><td>90</td><td>97</td><td>93</td><td>90</td>

</tr>

<tr valign=”bottom”>

<td>琳琳</td><td>92</td><td>90</td><td bordercolor=”#FF0000″>88</td><td>95</td>

</tr>

<tr height=”90″>

<td>娜丽</td><td bordercolor=”#FF0000″>89</td><td>93</td><td>94</td><td>92</td>

</tr>

</table>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>习题9.7</title>

</head>

<body>

<form action=”deal.asp” method=”post” name=”example”>

下面各中活动，你做过哪些：<br />

<input type=”checkbox” name=”act” value=”l1″ />打羽毛球

<input type=”checkbox” name=”act” value=”l2″ />打乒乓球

<input type=”checkbox” name=”act” value=”l3″ />踢毽子

<input type=”checkbox” name=”act” value=”l4″ />跳绳<br />

<input type=”checkbox” name=”act” value=”l5″ />游泳        

<input type=”checkbox” name=”act” value=”l6″ />捉迷藏

   

<input type=”checkbox” name=”act” value=”l7″ />爬山

   

<input type=”checkbox” name=”act” value=”l8″ />跳皮筋

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>习题9.7</title>

</head>

<body>

用户注册信息：

<form action=”deal.asp” method=”post” name=”example”>

用户名称：<input type=”text” name=”usrname” /><br />

密        码：<input type=”password” name=”password” /><br />

所在城市：<input type=”text” name=”city” /><br />

工作单位：<input type=”text” name=”work” /><br />

家庭住址：<input type=”text” name=”home” /><br />

性        别：<input type=”radio” name=”sex” value=”l1″ />男

   <input type=”radio” name=”sex” value=”l2″ />女<br />

爱        好：<select name=”like”>

<option value=”i1″>音乐</option>

<option value=”i2″>体育</option>

<option value=”i3″>计算机</option>

</select><br />

喜欢的公司：<select name=”com”>

<option value=”i4″>百度</option>

<option value=”i5″>微软</option>

<option value=”i6″>谷歌</option>

</select><br />

<textarea name=”self” rows=”10″ cols=”60″>

</textarea>

<br />

<input type=”submit” name=”yes” value=”提交” />

        

<input type=”reset” name=”no” value=”取消” />

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>习题9.7</title>

</head>

<body>

<form action=”deal.asp” method=”post” name=”example”>

以下节气按照时间顺序排列正确的是：<br />

<input type=”radio” name=”test” value=”l1″ />A.立冬、小雪、小寒、冬至<br />

<input type=”radio” name=”test” value=”l2″ />B.白露、秋分、寒露、霜降<br />

<input type=”radio” name=”test” value=”l3″ />C.小暑、大暑、处暑、立秋<br />

<input type=”radio” name=”test” value=”l4″ />D.立春、惊蛰、雨水、春分<br />

</form>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>线段粗细的设定</title>

</head>

<body>

<p>此线段无设定，取size=1<br />

<hr />

<p>设置此线段size=5<br />

<hr size=5 />

<p>设置此线段size=10<br />

<hr size=10 />

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>创建有序列表</title>

</head>

<body>

<font size=”5″ color=”#FF3333″>12星座排序：</font><br /><br />

<ol type=”i”>

<li>白羊座

<li>金牛座

<li>双子座

<li>巨蟹座

<li>狮子座

<li>处女座

<li>天平座

<li>天蝎座

<li>射手座

<li>摩羯座

<li>水瓶座

<li>双鱼座

</ol>

</body>

</html>

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>字体样式</title>

</head>

<body>

爱心是一片照射在冬日的阳光，是贫病交迫的人感到人间的温暖<br />

<strong>爱心是一股撞开冰闸的春水，使铁石心肠受到震撼。</strong><br />

<b>爱心是一座亮在黑夜的灯塔，使迷途航船找到港湾。</b><br />

<em>爱心是一瓢洒在春天的小雨，是孤独寂寞的人享受心灵的滋润，</em><br />

<i>爱心是一汩流淌在夏夜的清泉，使燥热不寐的人领略诗般的恬静。</i><br />

<cite>爱心是一柄撑在雨夜的小伞，使漂泊异乡的人得到亲情的庇佑。</cite><br />

<u>爱心是一道飞架在天边的彩虹，使满眼阴霾的人见到世界的美丽。</u><br />

</body>

</html>

相关文章：

你感兴趣的文章：

标签云：