如何设计一个图文并茂的页面

        炎炎夏日，知了声声叫着夏天的童年早已不复存在，想起远方的诗行为梦想助航。在清爽的宝地敲响一行行代码，顿时觉得编程真的挺好玩，跳动的音符堪比优美的旋律。

       很有感触就是在项目成成长，不仅仅是代码的属性、代码量的积累还有团队合作、相互进步，不妨亲临体验获得向日葵的微笑。

       最近在一个金银珠宝玉石饰品质量监督检查站的网站项目，还算比较有成就的把组长分配的模块做好了。一次开会中项目组长说那你去设计“证书查询”页面吧，虽然页面的这部分真的还有点畏怯，但何尝不是此提升的机会呢？而且能为项目多做些贡献是件多么值得开心的事情，项目中共同相互帮助是一个团队的体现。

      老师也常说UI即页面就是系统、网站的门户，用户想不想用就在系统网站的用户体会，用户体验很重要的一部分在页面的设计上。便斗胆地答应下“重任”。

      还好在之前的计量局项目中涉及过页面设计的部分内容，想起了之前李组长说的一句话div便在脑中构思“证书查询”页面的大体设计思路，如下：

打包好行囊变开始旅程，在沙漠中探索甘泉。想设计好一个美观的页面真的不是太简单，不至于是海市蜃楼至少可是“千呼万唤始出来”：

        让我们一起见证奇迹的庐山真面目：

<pre name="code" class="html"><div style="border:1px ; width:300px; height:30px;padding-left:15px;padding-top:20px;">            <h3 >证书查询</h3>    </div>    <div style="border:1px ; width:750px; height:500px;padding-left:15px;padding-top:30px;">              编号： <input type="text" style="border:1px solid #87cefa;margin:10px 15px 10px -10px;"/> </br>        验证码：<input type="text" style="border:1px solid #87cefa; margin:10px 15px 10px 12px;"/></br>    <input type="button" class="easyui-button" style="width:80px; height:25px; margin:20px 15px 10px 75px;border:1px solid #87cefa;" value="查询"/>    <div style="border:1px solid #e6e6e6;padding:5px 5px; width:350px; height:250px; float:right;position:relative ;margin-top:-150px;margin-right:40px; background-size:100% 100%;">        <img  style="margin-right:5px;width:100%;height:100%" src="../../images/Certificate/certificate_index_example.png" />    </div></div>             

        谢谢帮助我的往组长！重新整理思路，喜欢自己画画，和之前的没有很大的区别，只是过程需要探索：

        美工、html部分的知识还需要温故加强。

        越体会，多一个承担多一份交流便多不只是一份的收获，也是成长的法宝。“证书查询”页面至少，给予的不仅仅是知识还有交流，也多了一份相信。