jQuery MiniUI

标题: 奇怪的问题：不能撑满页面？ [打印本页]
作者: sxyzy    时间: 2013-5-23 18:02:48     标题: 奇怪的问题：不能撑满页面？

本帖最后由 sxyzy 于 2013-5-23 18:09 编辑

实验1：显示：[attach]1998[/attach]
代码：
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head id="Head1"><title>
  5.         角色列表
  6. </title>

  8.     <script src="/scripts/boot.js" type="text/javascript"></script>

  10.     <style type="text/css">
  11.         html, body
  12.         {
  13.             margin: 0;
  14.             padding: 0;
  15.             border: 0;
  16.             width: 100%;
  17.             height: 100%;
  18.             overflow: hidden;
  19.         }
  20.     </style>
  21. </head>
  22. <body>
  23.     <form name="form1" method="post" action="RoleList.aspx" id="form1">
  24. <div>
  25. <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTM5NTIzODUyMWRkmIcq77XdZeQVq2Vl+FMhgz81kh8=" />
  26. </div>

  28.     <div class="mini-toolbar" style="padding: 2px; border-bottom: 0;">
  29.         <table style="width: 100%;">
  30.             <tr>
  31.                 <td style="width: 100%;">
  32.                     <a id="A1" class="mini-button" iconcls="icon-add" onclick="add()">增加</a>
  33.                     <a id="A2" class="mini-button" iconcls="icon-add" onclick="edit()">编辑</a>
  34.                     <a id="A3" class="mini-button" iconcls="icon-remove" onclick="remove()">
  35.                         删除</a>
  36.                 </td>
  37.                 <td style="white-space: nowrap;">
  38.                     <input id="key" class="mini-textbox" emptytext="请输入角色名称" style="width: 150px;" onenter="onKeyEnter" />
  39.                     <a class="mini-button" onclick="search()">查询</a>
  40.                 </td>
  41.             </tr>
  42.         </table>
  43.     </div>
  44.     <!--撑满页面-->
  45.     <div class="mini-fit" style="height: 100%;">
  46.         <div id="datagrid1" class="mini-datagrid" style="width: 100%;height: 100%;" allowresize="true"
  47.             url="RoleService.aspx?method=SearchRole" idfield="RoleId" multiselect="true">
  48.             <div property="columns">
  49.                 <div type="indexcolumn" width="10%"></div>
  50.                 <div type="checkcolumn" width="10%">
  51.                 </div>
  52.                 <div field="RoleName" width="30%" headeralign="center" allowsort="true">
  53.                     角色</div>
  54.                 <div field="RoleRemark" width="50%" headeralign="center" allowsort="true">
  55.                     角色备注</div>
  56.             </div>
  57.         </div>
  58.     </div>
  59.     </form>

  61.        <script type="text/javascript">
  62.       
  63.            /////////////////////////////////////////////////      

  65.     </script>

  67. </body>
  68. </html>
复制代码


实验2：显示[attach]2000[/attach]
代码：
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head id="Head1"><title>
  4.         角色列表
  5. </title>

  7.     <script src="/scripts/boot.js" type="text/javascript"></script>

  9.     <style type="text/css">
  10.         html, body
  11.         {
  12.             margin: 0;
  13.             padding: 0;
  14.             border: 0;
  15.             width: 100%;
  16.             height: 100%;
  17.             overflow: hidden;
  18.         }
  19.     </style>
  20. </head>
  21. <body>
  22.     <form name="form1" method="post" action="RoleList.aspx" id="form1">
  23. <div>
  24. <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTM5NTIzODUyMWRkmIcq77XdZeQVq2Vl+FMhgz81kh8=" />
  25. </div>

  27.     <div class="mini-toolbar" style="padding: 2px; border-bottom: 0;">
  28.         <table style="width: 100%;">
  29.             <tr>
  30.                 <td style="width: 100%;">
  31.                     <a id="A1" class="mini-button" iconcls="icon-add" onclick="add()">增加</a>
  32.                     <a id="A2" class="mini-button" iconcls="icon-add" onclick="edit()">编辑</a>
  33.                     <a id="A3" class="mini-button" iconcls="icon-remove" onclick="remove()">
  34.                         删除</a>
  35.                 </td>
  36.                 <td style="white-space: nowrap;">
  37.                     <input id="key" class="mini-textbox" emptytext="请输入角色名称" style="width: 150px;" onenter="onKeyEnter" />
  38.                     <a class="mini-button" onclick="search()">查询</a>
  39.                 </td>
  40.             </tr>
  41.         </table>
  42.     </div>
  43.     <!--撑满页面-->
  44.     <div class="mini-fit" style="height: 100%;">
  45.         <div id="datagrid1" class="mini-datagrid" style="width: 100%;height: 100%;" allowresize="true"
  46.             url="RoleService.aspx?method=SearchRole" idfield="RoleId" multiselect="true">
  47.             <div property="columns">
  48.                 <div type="indexcolumn" width="10%"></div>
  49.                 <div type="checkcolumn" width="10%">
  50.                 </div>
  51.                 <div field="RoleName" width="30%" headeralign="center" allowsort="true">
  52.                     角色</div>
  53.                 <div field="RoleRemark" width="50%" headeralign="center" allowsort="true">
  54.                     角色备注</div>
  55.             </div>
  56.         </div>
  57.     </div>
  58.     </form>

  60.        <script type="text/javascript">

  62.            /////////////////////////////////////////////////      

  64.     </script>

  66. </body>
  67. </html>
复制代码
作者: sxyzy    时间: 2013-5-23 18:08:29

两次的变更的是DOCTYPE声明；
第一次不能显示内容，第二次不能显示页脚和字段宽度没有按照要求显示。

asp.net c#
作者: niko    时间: 2013-5-23 21:53:00

1.头部必须加：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.<form style="width:100%;height:100%"

作者: sxyzy    时间: 2013-5-24 09:38:44

niko 发表于 2013-5-23 21:53
1.头部必须加：

2.

感谢！已解决！



欢迎光临 jQuery MiniUI (http://miniui.com/discuss/) Powered by Discuz! X2