一个简单又不简单的Css设计实例

一个简单又不简单的Css设计实例

首先给出结构,请注意,是结构固定在先,表现设计在后。

 1 <body>

 2     <div id=”PopPage”>

 3         <h3>新增联系人</h3>

 4         <div>

 5        <label>姓名</label>

 6        <input type=”text” />

 7         </div>

 8         <div>

 9        <label>姓名</label>

10        <input type=”text” />

11         </div>

12         <div>

13        <label>姓名</label>

14        <input type=”text” />

15         </div>

16         <!– 以次类推,我就不写了 –>

17         <div class=”buttonarea”>

18        <input type=”button” value=”添加” />

19        <input type=”button” value=”重填” />

20         </div>

21     </div>

22 </body>

下面是设计师提供的设计稿:

  说明:有几个限制。

  1、不能在body上定义背景图片。

  2、结构不允许改变,也就是增加额外标签。

  3、要求适应分辨率,因为此类页面不仅仅作为宽度固定的弹出页面,同时也要作为宽度不固定的内页。(表单内容会改变)

  算了,不列了,要说限制可能还能写一些出来,但没意思了,干脆这样说:如何仅依赖css实现容度更高的整体布局。大家有兴趣可以试试看,三天后周日再给出我的Css和思路。当然不是标准答案,看看谁的容度最大。^_^

一个简单又不简单的Css设计实例

相关文章:

你感兴趣的文章:

标签云: