搜尋
首頁web前端html教學UI菜鸟,请教问题_html/css_WEB-ITnose

谁能刚告诉我这个页面怎么做的吗?用asp.net


回复讨论(解决方案)

有人么?请教了。。。

帮我做一个小模块就行了。。非常感谢。。

都没人么?伤心了。。。

来人啊。。帮帮忙吧。。谢谢。。

各位大虾谢谢了。。

去ASP栏块去问!

自己学习,这个不难~

多选文本框

以前只能三连回,现在改了?

我只记得table的布局:一个大的table嵌套三个小的table,table中有三列,每一列右对齐;至于复选框就是复选框属性值为true。

我只记得table的布局:一个大的table嵌套三个小的table,table中有三列,每一列右对齐;至于复选框就是复选框属性值为true。

楼主,我用div+css+jQuery帮你实现了,希望对你有所帮助,运行的时候,记得导入jQuery的js文件,以下是代码:
样式文件css.css

.mainContent {     position: absolute;    top: 50px;    left: 245px;    right: 245px;    bottom: 50px;    overflow: auto;}.topContent{    position: absolute;    top: 5px;    left: 5px;    right: 5px;    height: 28px;    background: url(../images/bg.png);}.leftTitle{    position: relative;    top: 2px;    left: 10px;    padding: 5px;    font: 12px "宋体";}.rightCheck{    position: relative;    top: 5px;    left: 0px;    padding: 2px;}.middleBuyContent{    position: absolute;    top: 35px;    left: 5px;    right: 5px;    height: 165px;}.leftTd{    font: 12px "宋体";    float: right;    padding: 5px;    text-align: right;}.rightTd{    float: right;    padding: 2px;    text-align: left;    margin-right: 20px;}.middleSellContent{    position: absolute;    top: 185px;    left: 5px;    right: 5px;    height: 28px;    background: url(../images/bg.png);}.middleSellInfoContent{    position: absolute;    top: 215px;    left: 5px;    right: 5px;    height: 165px;}.bottomContent{    position: absolute;    top: 370px;    left: 5px;    right: 5px;    height: 28px;    background: url(../images/bg.png);}.bottomBoxInfoContent{    position: absolute;    top: 400px;    left: 5px;    right: 5px;    height: 80px;}

js文件:operaation.js
            $(function(){                //采购权限                $("#buyRule").click(function(){                    //获取该div下的复选框的个数                    var v = $("#buyRuleTable").find(":checkbox").size();                    var flag = $(this).get(0).checked;                    if(flag){                        for(var i = 0;i < v;i++){                            $("#buyRuleTable").find(":checkbox").get(i).checked = true;                        }                    }else{                        for(var i = 0;i < v;i++){                            $("#buyRuleTable").find(":checkbox").get(i).checked = false;                        }                    }                });                //销售权限                $("#sellRule").click(function(){                    //获取该div下的复选框的个数                    var v = $("#sellRuleTable").find(":checkbox").size();                    var flag = $(this).get(0).checked;                    if(flag){                        for(var i = 0;i < v;i++){                            $("#sellRuleTable").find(":checkbox").get(i).checked = true;                        }                    }else{                        for(var i = 0;i < v;i++){                            $("#sellRuleTable").find(":checkbox").get(i).checked = false;                        }                    }                });                //仓库管理                $("#boxRule").click(function(){                    //获取该div下的复选框的个数                    var v = $("#boxRuleTable").find(":checkbox").size();                    var flag = $(this).get(0).checked;                    if(flag){                        for(var i = 0;i < v;i++){                            $("#boxRuleTable").find(":checkbox").get(i).checked = true;                        }                    }else{                        for(var i = 0;i < v;i++){                            $("#boxRuleTable").find(":checkbox").get(i).checked = false;                        }                    }                });            })

html文件如下:index.html

<!DOCTYPE html><html>    <head>        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">        <title>netone</title>        <link rel="stylesheet" type="text/css" href="css/css.css" />        <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>		<script type="text/javascript" src="js/operaation.js"></script>    </head>    <body>        <div class="mainContent">            <div class="topContent">                <span class="leftTitle">采购权限</span>                <span class="rightCheck"><input type="checkbox" id="buyRule"/></span>            </div>            <div class="middleBuyContent">                <table border="0" width="100%" id="buyRuleTable">                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增采购单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">修改采购单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除采购单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览采购单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增退货单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">修改退货单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除退货单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览退货单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">物品采购汇总表</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">物品采购明细表</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">供应商采购汇总表</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">采购订单完成情况</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增采购订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">编辑采购订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除采购订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览采购订单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">审核采购订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">反审采购订单</div></td>                        <td></td>                        <td></td>                    </tr>                </table>            </div>            <div class="middleSellContent">                <span class="leftTitle">销售权限</span>                <span class="rightCheck"><input type="checkbox" id="sellRule"/></span>            </div>            <div class="middleSellInfoContent">                <table border="0" width="100%" id="sellRuleTable">                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增销售单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">修改销售单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除销售单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览销售单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增退货单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">修改退货单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除退货单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览退货单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">物品销售汇总表</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">物品销售明细表</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">客户销售汇总表</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">销售订单完成情况</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增销售订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">编辑销售订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除销售订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览销售订单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">审核销售订单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">反审销售订单</div></td>                        <td></td>                        <td></td>                    </tr>                </table>            </div>            <div class="bottomContent">                <span class="leftTitle">库存管理</span>                <span class="rightCheck"><input type="checkbox" id="boxRule"/></span>            </div>            <div class="bottomBoxInfoContent">                <table border="0" width="100%" id="boxRuleTable">                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增入库单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">修改入库单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除入库单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览入库单</div></td>                    </tr>                    <tr>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">新增出库单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">修改出库单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">删除出库单</div></td>                        <td><div class="rightTd"><input type="checkbox" /></div><div class="leftTd">浏览出库单</div></td>                    </tr>                </table>            </div>        </div>    </body></html>

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?Mar 04, 2025 pm 12:32 PM

公眾號網頁更新緩存,這玩意兒,說簡單也簡單,說複雜也夠你喝一壺的。你辛辛苦苦更新了公眾號文章,結果用戶打開還是老版本,這滋味,誰受得了?這篇文章,咱就來扒一扒這背後的彎彎繞繞,以及如何優雅地解決這個問題。讀完之後,你就能輕鬆應對各種緩存難題,讓你的用戶始終體驗到最新鮮的內容。先說點基礎的。網頁緩存,說白了就是瀏覽器或者服務器為了提高訪問速度,把一些靜態資源(比如圖片、CSS、JS)或者頁面內容存儲起來。下次訪問時,直接從緩存裡取,不用再重新下載,速度自然快。但這玩意兒,也是個雙刃劍。新版本上線,

如何使用HTML5表單驗證屬性來驗證用戶輸入?如何使用HTML5表單驗證屬性來驗證用戶輸入?Mar 17, 2025 pm 12:27 PM

本文討論了使用HTML5表單驗證屬性,例如必需的,圖案,最小,最大和長度限制,以直接在瀏覽器中驗證用戶輸入。

如何高效地在網頁中為PNG圖片添加描邊效果?如何高效地在網頁中為PNG圖片添加描邊效果?Mar 04, 2025 pm 02:39 PM

本文展示了使用CSS為網頁中添加有效的PNG邊框。 它認為,與JavaScript或庫相比,CSS提供了出色的性能,詳細介紹瞭如何調整邊界寬度,樣式和顏色以獲得微妙或突出的效果

HTML5中跨瀏覽器兼容性的最佳實踐是什麼?HTML5中跨瀏覽器兼容性的最佳實踐是什麼?Mar 17, 2025 pm 12:20 PM

文章討論了確保HTML5跨瀏覽器兼容性的最佳實踐,重點是特徵檢測,進行性增強和測試方法。

&lt; datalist&gt;的目的是什麼。 元素?&lt; datalist&gt;的目的是什麼。 元素?Mar 21, 2025 pm 12:33 PM

本文討論了html&lt; datalist&gt;元素,通過提供自動完整建議,改善用戶體驗並減少錯誤來增強表格。Character計數:159

&lt; meter&gt;的目的是什麼。 元素?&lt; meter&gt;的目的是什麼。 元素?Mar 21, 2025 pm 12:35 PM

本文討論了HTML&lt; meter&gt;元素,用於在一個範圍內顯示標量或分數值及其在Web開發中的常見應用。它區分了&lt; meter&gt;從&lt; progress&gt;和前

&gt; gt;的目的是什麼 元素?&gt; gt;的目的是什麼 元素?Mar 21, 2025 pm 12:34 PM

本文討論了HTML&lt; Progress&gt;元素,其目的,樣式和與&lt; meter&gt;元素。主要重點是使用&lt; progress&gt;為了完成任務和LT;儀表&gt;對於stati

我如何使用html5&lt; time&gt; 元素以語義表示日期和時間?我如何使用html5&lt; time&gt; 元素以語義表示日期和時間?Mar 12, 2025 pm 04:05 PM

本文解釋了HTML5&lt; time&gt;語義日期/時間表示的元素。 它強調了DateTime屬性對機器可讀性(ISO 8601格式)的重要性,並在人類可讀文本旁邊,增強Accessibilit

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前By尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
1 個月前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
4 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

EditPlus 中文破解版

EditPlus 中文破解版

體積小,語法高亮,不支援程式碼提示功能

SublimeText3 英文版

SublimeText3 英文版

推薦:為Win版本,支援程式碼提示!

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境