1. <div id=”chatbox”>
2.   <div id=”friendslist”>
3.       <div id=”topmenu”>
4.           <span class=”friends”></span>
5.             <span class=”chats”></span>
6.             <span class=”history”></span>
7.         </div>
9.         <div id=”friends”>
10.           <div class=”friend”>
11.               <img src=”img/1_copy.jpg” />
12.                 <p>
13.                   <strong>Miro Badev</strong>
14.                   <span>mirobadev@gmail.com</span>
15.                 </p>
16.                 <div class=”status available”></div>
17.             </div>
18.             ……
19.             <div id=”search”>
20.               <input type=”text” id=”searchfield” value=”Search contacts…” />
21.             </div>
22.         </div>
23.     </div>
24.     <div id=”chatview” class=”p1″>
25.         <div id=”profile”>
27.             <div id=”close”>
28.                 <div class=”cy”></div>
29.                 <div class=”cx”></div>
30.             </div>
32.             <p>Miro Badev</p>
33.             <span>miro@badev@gmail.com</span>
34.         </div>
35.         <div id=”chat-messages”>
36.           <label>Thursday 02</label>
38.             <div class=”message”>
39.               <img src=”img/1_copy.jpg” />
40.                 <div class=”bubble”>
41.                   Really cool stuff!
42.                     <div class=”corner”></div>
43.                     <span>3 min</span>
44.                 </div>
45.             </div>
46.         </div>
48.         <div id=”sendmessage”>
49.           <input type=”text” value=”Send message…” />
50.             <button id=”send”></button>
51.         </div>
52.     </div>
53. </div>

复制代码