📄 day2_5actiscenei.htm

📁 成为真正的网页制作的高手的话,必须了解并使用DHTML.这里提供了最好的手册和文档.
💻 HTM
字号:
<html>

<head>
<title>Webmonkey: dramatis personae</title>
<link rel="stylesheet" href="/webmonkey/98/10/css1a/drama.css">
<style type="text/css">
#dialog14 {position:absolute; left:381px; top:63px; width:77px; height:73px; z-index:55}
#dialog13 {position:absolute; left:11px; top:283px; width:141px; height:29px; z-index:54}
#dialog12 {position:absolute; left:133px; top:242px; width:115px; height:44px; z-index:53}
#dialog11 {position:absolute; left:273px; top:17px; width:153px; height:20px; z-index:52}
#dialog10 {position:absolute; left:203px; top:62px; width:57px; height:60px; z-index:51}
#dialog9 {position:absolute; left:151px; top:9px; width:106px; height:30px; z-index:50}
#dialog8 {position:absolute; left:364px; top:21px; width:0px; height:1px; z-index:49}
#dialog7 {position:absolute; left:27px; top:11px; width:108px; height:23px; z-index:48}
#dialog6 {position:absolute; left:93px; top:133px; width:118px; height:26px; z-index:47}
#dialog5 {position:absolute; left:374px; top:150px; width:76px; height:22px; z-index:46}
#dialog4 {position:absolute; left:219px; top:296px; width:113px; height:19px; z-index:45}
#dialog3 {position:absolute; left:276px; top:197px; width:161px; height:25px; z-index:44}
#dialog2 {position:absolute; left:218px; top:124px; width:170px; height:38px; z-index:43}
#dropshadow {position:absolute; left:456px; top:37px; width:163px; height:252px; z-index:40}
#dialog1 {position:absolute; left:455px; top:36px; width:163px; height:252px; z-index:41}
#wendy {position:absolute; left:131px; top:47px; width:24px; height:47px; z-index:18}
#tim {position:absolute; left:140px; top:193px; width:22px; height:29px; z-index:33}
#thau {position:absolute; left:14px; top:50px; width:28px; height:42px; z-index:15}
#taylor {position:absolute; left:343px; top:224px; width:23px; height:35px; z-index:37}
#shvatz {position:absolute; left:329px; top:153px; width:28px; height:49px; z-index:27}
#nadav {position:absolute; left:340px; top:74px; width:25px; height:43px; z-index:22}
#kristin {position:absolute; left:9px; top:215px; width:47px; height:70px; z-index:32}
#klug {position:absolute; left:261px; top:62px; width:34px; height:58px; z-index:25}
#jeff {position:absolute; left:39px; top:131px; width:37px; height:58px; z-index:24}
#jeanPierre {position:absolute; left:203px; top:148px; width:49px; height:59px; z-index:20}
#chair5 {position:absolute; left:23px; top:44px; width:34px; height:64px; z-index:14}
#chair4 {position:absolute; left:162px; top:41px; width:34px; height:64px; z-index:9}
#chair3 {position:absolute; left:301px; top:84px; width:34px; height:64px; z-index:21}
#chair1 {position:absolute; left:12px; top:204px; width:34px; height:64px; z-index:31}
#chair8 {position:absolute; left:365px; top:241px; width:28px; height:43px; z-index:36}
#chair7 {position:absolute; left:365px; top:156px; width:28px; height:43px; z-index:26}
#chair6 {position:absolute; left:145px; top:59px; width:28px; height:43px; z-index:10}
#chair2 {position:absolute; left:149px; top:201px; width:28px; height:43px; z-index:29}
#interns {position:absolute; left:399px; top:296px; width:250px; height:54px; z-index:39}
#anna {position:absolute; left:253px; top:243px; width:30px; height:48px; z-index:35}
#aaron {position:absolute; left:166px; top:56px; width:38px; height:0px; z-index:12}
#extraDesk {position:absolute; left:289px; top:61px; width:66px; height:34px; z-index:5}
#wendyThauDesk {position:absolute; left:33px; top:54px; width:49px; height:38px; z-index:17}
#aaronDesk {position:absolute; left:191px; top:57px; width:37px; height:52px; z-index:13}
#nadavDesk {position:absolute; left:279px; top:130px; width:55px; height:29px; z-index:23}
#kristinTimDesk {position:absolute; left:24px; top:198px; width:50px; height:78px; z-index:34}
#taylorDesk {position:absolute; left:277px; top:197px; width:142px; height:53px; z-index:28}
#taylorShelf {position:absolute; left:160px; top:259px; width:124px; height:92px; z-index:38}
</style>
</head>

<body bgcolor="#00CC00" background="http://static.wired.com/webmonkey/98/10/stuff/greenLeggoFloor.gif" text="#FFFFFF">
<div id="taylorShelf" class="chorus">
<dd><img src="dy3_6wendyThau.gif" width="124" height="83" alt="dy3_6wendyThau.gif (3795 bytes)"> </dd>
</div><div id="taylorDesk">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/taylorShvatzDesk.gif" width="161" height="68"> </dd>
</div><div id="kristinTimDesk">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/kristinTimDesk.gif" width="124" height="125"> </dd>
</div><div id="nadavDesk">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/nadavDesk.gif" width="136" height="54"> </dd>
</div><div id="aaronDesk">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/aaronDesk.gif" width="59" height="84"> </dd>
</div><div id="wendyThauDesk">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/wendyThau.gif" width="124" height="83"> </dd>
</div><div id="extraDesk">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/extraDesk.gif" width="122" height="48"> </dd>
</div><div id="aaron">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/aaron.gif" width="40" height="71"> </dd>
</div><div id="anna">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/anna.gif" width="40" height="71"> 
</dd>
</div><div id="interns">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/cassandra.gif" width="47" height="71"><img src="http://static.wired.com/webmonkey/98/10/stuff/chris.gif" width="44" height="69"><img src="http://static.wired.com/webmonkey/98/10/stuff/courtney.gif" width="46" height="72"><img src="http://static.wired.com/webmonkey/98/10/stuff/joanne.gif" width="46" height="74"> </dd>
</div><div id="chair2">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairLeft.gif" width="37" height="61"> </dd>
</div><div id="chair6">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairLeft.gif" width="37" height="61"> </dd>
</div><div id="chair7">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairLeft.gif" width="37" height="61"> </dd>
</div><div id="chair8">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairLeft.gif" width="37" height="61"> </dd>
</div><div id="chair1">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairRight.gif" width="37" height="61"> </dd>
</div><div id="chair3">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairRight.gif" width="37" height="61"> </dd>
</div><div id="chair4">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairRight.gif" width="37" height="61"> </dd>
</div><div id="chair5">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/chairRight.gif" width="37" height="61"> </dd>
</div><div id="jeanPierre">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/jeanPierre.gif" width="45" height="80"> </dd>
</div><div id="jeff">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/jeff.gif" width="78" height="77"> 
</dd>
</div><div id="klug">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/klug.gif" width="43" height="70"> 
</dd>
</div><div id="kristin">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/kristin.gif" width="42" height="67"> </dd>
</div><div id="nadav">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/nadav.gif" width="43" height="70"> </dd>
</div><div id="shvatz">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/shvatz.gif" width="38" height="66"> </dd>
</div><div id="taylor">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/taylor.gif" width="43" height="80"> </dd>
</div><div id="thau">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/thau.gif" width="43" height="70"> 
</dd>
</div><div id="tim">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/tim01.gif" width="41" height="79"> </dd>
</div><div id="wendy">
<dd><img src="http://static.wired.com/webmonkey/98/10/stuff/wendy.gif" width="46" height="74"> </dd>
</div><div id="dialog1" class="chorus">

<p class="chorus">Lo! Long did the Webmonkeys toil at their task. Much effort was put into 
their tutorials and articles. And, verily, was it all done, on schedule, with a minimum of 
chatter.</p>

<p class="chorus">And peace and knowledge of HTML techniques did spread across the land. 
And the digerati was muchly pleased.</p>
</div><div id="dropshadow" class="chorus">

<p class="chorusDrop">Lo! Long did the Webmonkeys toil at their task. Much effort was put 
into their tutorials and articles. And verily, was it all done, on schedule, with a 
minimum of chatter.</p>

<p class="chorusDrop">And peace and knowledge of HTML techniques did spread across the 
land. And the digerati was muchly pleased.</p>
</div><div id="dialog2" class="actor">

<p>Je n'ai pas le scrittorio. O&ograve; I ils sont bases? </p>
</div><div id="dialog3" class="actor">

<p>Can't eat, must write. </p>
</div><div id="dialog4" class="actor">

<p>Let's get lunch. </p>
</div><div id="dialog5" class="actor">

<p>Jungle, jungle, jungle! </p>
</div><div id="dialog6" class="actor">

<p>I'm going to bike to Ecuador! </p>
</div><div id="dialog7" class="actor">

<p>Bianca Loves You! </p>
</div><div id="dialog8"></div><div id="dialog9" class="actor">

<p>This is so cool! </p>
</div><div id="dialog10" class="actor">

<p>I am afeard<!--sic--> of this schedule. </p>
</div><div id="dialog11" class="actor">

<p>So I gave these frat boys directions to Denny's at two a.m. </p>
</div><div id="dialog12" class="actor">

<p>I gotta go get a burrito. </p>
</div><div id="dialog13" class="actor">

<p>Where's my stick!?! </p>
</div><div id="dialog14" class="actor">

<p>This quote doesn't sound like me at all. </p>
</div>
</body>
</html>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -