代码：
<table width="810" border="0" align="center" cellpadding="0" cellspacing="0"><tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17900104834a90f603728de9ef.jpg" width="810" height="70"></div></td>
</tr>
<tr>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/68acc35594eef01f9e96ea77e0fe9925bd317da3.jpg" width="70" height="500"></div></td>
<td width="670"><div style="background-color:#6D010E;">
<table width="670" height="500" border="5" align="center" cellpadding="10" cellspacing="10">
<tr>
<td align="center">
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/2ffdfb8e8c5494ee6ca5f4aa2df5e0fe98257ea7.jpg" width="466" height="37"></div>
<p>内容输入口一</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/16a32a390cd79123e56d6fc7ad345982b3b7809d.jpg" width="319" height="75"></div>
<p>内容输入口二</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/2ffdfb8e8c5494ee6ca5f4aa2df5e0fe98257ea7.jpg" width="466" height="37"></div>
<p>内容输入口三</p>
</td></tr>
</table></div>
</td>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/96ce61728bd4b31ca6d7660987d6277f9f2ff8ba.jpg" width="70" height="500"></div></td>
</tr>
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/4f30ff7fca8065388da02ca197dda144ac3482db.jpg" width="810" height="70"></div></td>
</tr>
</table>
实例2
代码：
<table width="825" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/74f0b21e4134970a4a0c349c95cad1c8a7865d2e.jpg" width="825" height="108"></div></td>
</tr>
<tr>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/a0fac21101e93901607aa98d7bec54e736d19629.jpg" width="109" height="500"></div></td>
<td width="607"><div style="background-color: #FFF7FB;">
<table width="607" height="500" border="1" align="center" cellpadding="10" cellspacing="0">
<tr>
<td align="center">
<p>输入接口</p>
<div><img src="http://hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/3b32dfee5e92e5bbce1b3ea9.jpg" width="446" height="270" small="0" /></div>
<p>输入接口</p>
<div><img src="http://hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/1fdeb3029245d688e682f517a4c27d1ed31b24a1.jpg"
width="300" height="75"></div>
<p>输入接口</p>
</td></tr>
</table></div>
</td>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/aae5e8eece1b9d16aebfbed2f3deb48f8c546429.jpg" width="109" height="500"></div></td>
</tr>
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/68acc35594eef01f606b3c76e0fe9925bc317d2e.jpg" width="825" height="108"></div></td>
</tr>
</table>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
实例3：
代码：
<table width="850" height="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/71171683b2b7d0a223b3262ecbef76094b369a2b.jpg" width="850" height="110"></div></td>
</tr>
<tr>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/c234c583b9014a903544640ea9773912b31bee34.jpg" width="110" height="500"></div></td>
<td width="630"><div style="background-color:#6D010E;">
<table width="630" height="500" border="5" align="center" cellpadding="10" cellspacing="10">
<tr>
<td align="center">
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg" width="466" height="37"></div>
<p>输入接口</p>
<div><img src="http://hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg" width="466" height="37"></div>
<p>输入接口</p>
<div><img src="http://hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"width="466" height="37"></div>
<p>输入接口</p>
<div><img src="http://hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg" width="466" height="37"></div>
</td></tr>
</table></div>
</td>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/243ac919367adab487aa39f08bd4b31c8701e434.jpg" width="110" height="500"></div></td>
</tr>
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/091af9013af33a87f51722a9c65c10385343b52b.jpg" width="850" height="110"></div></td>
</tr>
</table>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
实例4： 代码： <table width="820" border="0" align="center" cellpadding="0" cellspacing="0"> <div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/78e1321fd21b0ef4a1945decddc451da81cb3e2d.jpg" width="400" height="155"></div> <p>内容进入口</p> <p>内容进入口</p> ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ 实例5
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/477300c3d562853585411a9390ef76c6a6ef6380.jpg" width="820" height="120"></div></td>
</tr>
<tr>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/21d9e050f3deb48fe9a3976df01f3a292cf5785b.jpg" width="83" height="500"></div></td>
<td width="654" ><div style="background-color:#6D010E;">
<table width="654" height="500" border="5" align="center" cellpadding="10" cellspacing="10">
<tr>
<td align="center">
<p>内容进入口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/78e1321fd21b0ef4a1945decddc451da81cb3e2d.jpg" width="400" height="155"></div>
</td></tr>
</table></div>
</td>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/708c61dca3cc7cd9c1e8026a3901213fb90e9164.jpg" width="83" height="500"></div></td>
</tr>
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/ae2d43f2d7ca7bcb11db0f9dbe096b63f724a881.jpg" width="820" height="120"></div></td>
</tr>
</table>
代码：
<table width="850" height="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7F2/pic/item/56a1f6004a90f603c10f80f33912b31bb151ede8.jpg" width="850" height="100"></div></td>
</tr>
<tr>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7F2/pic/item/d390402542a7d9335e10f8c7ad4bd11372f001ea.jpg" width="100" height="500"></div></td>
<td><div style="background-color:#C7AFF3;">
<table width="650" height="500" border="4" align="center" cellpadding="10" cellspacing="0">
<tr>
<td align="center">
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
<p>输入接口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
<p>输入接口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
<p>输入接口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
</td></tr>
</table></div>
</td>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%
F2/pic/item/08096735349b033b5933e06e15ce36d3d439bdeb.jpg" width="100" height="500"></div></td>
</tr>
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%
F2/pic/item/868ceb0e4bfbfbed0be62acb78f0f736aec31fef.jpg" width="850" height="100"></div></td>
</tr>
</table>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
实例6
代码：
<table width="825" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/78e1321fd21b0ef48e47b8ebddc451da80cb3ef8.jpg" width="855" height="104"></div></td>
</tr>
<tr>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/069705ec2e738bd461879284a18b87d6267ff982.jpg" width="104" height="1028"></div></td>
<td width="586"><div style="background-color:#000000;">
<table width="647" height="1028" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><div>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
<p>输入接口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
<p>输入接口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
<p>输入接口</p>
<div><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f8acd27cffc1e17ef44cb824a90f603728de9ab.jpg"
width="466" height="37"></div>
</div>
</td>
</tr>
</table>
</div>
</td>
<td width="70"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/9f3522234f4a20a4bd931c7290529822730ed09f.jpg" width="104" height="1028"></div></td>
</tr>
<tr>
<td colspan="3"><div align="center"><img src="//hiphotos.baidu.com/%CB%D5%D1%EF%B8%FB%B7%F2/pic/item/4e669989d43f87943550689bd21b0ef41ad53af8.jpg" width="855" height="104"></div></td>
</tr>
</table>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
说明：
1、给音画添加内容，建议先将音画套装整体复制、粘贴到空间写新文章的编辑框，然后再输入文本、插入图片、插入Flash动画或视频等。
2、代码中width、height分别表示宽和高，单位默认像素（px）。本例的音画净高暂时定义为500，此值最终根据内容多少决定，共有三处，一处为音画内容区高度，另两处分别是左边框和右边框高度，三者高度必须相等。这里制作的边框图片高都在1900像素以上，音画边框和内容区高的参数最大可定义2000多像素。
3、笔者插入的图片和预留的文字输入口，如果不需要可以删除或部分删除。
4、音画内容区背景颜色可以修改。找到代码<div style="background-color:#6D010E;">，只要修改颜色值即可，本例为 #6D010E（紫红色）。
5、这里的音画套装不仅高度可以调整，宽度也可以调整，您只要根据自己的模板宽度修改相关参数即可。
6、音画编辑的常见问题及解决办法请参考这里的辅助说明。
转自
