1. <body style="background:#f6f6f6;">
2. @*商品列表*@
3. <div class="container-fluid">
4. <div class="row" style="margin:0 auto;margin-top:5px;">
5. @*頭*@
6. @*商品分類和所屬分類*@
7. <div class="col-12" style="background:#ffffff;height:600px;width:100%; margin-top:5px;border:1px solid;color:#e7e7e7;">
8. <div id="shuxintu" style="width:10%;height:600px;float:left;border-right:1px solid; color:#e7e7e7;">
9. <div style="height:60px;border-bottom:1px solid;text-align:center;line-height:60px;">
10. <p style="color:#000000;">商品分類</p>
11. </div>
12. </div>
13. <div id="biange" style="width:90%;height:600px;float:left;">
14. @*兩小按鈕*@
15. <div style="width:24px;height:20px;position:relative;left:-9px;top:50%;background:#ffffff;">
16. <button style="width:8px;height:20px;background:#ff6a00;float:left" id="Shuxintu"></button>
17. <button style="width:8px;height:20px;background:#ffd800;" id="Biange"></button>
18. </div>
19. <div id="fenlei" style="width:100%;height:40px;border-bottom:1px solid;color:#e7e7e7;line-height:22px;">
20. <p style="color:#000000;float:left;margin-left:10px;">所屬分類:</p> <p style="color:#ff6a00;float:left;">商品分類</p>
21. </div>
22. @*表格*@
23. <div id="biaoge" style="margin:10px;">
24. <table class="layui-hide" id="InquireGoods"></table>
25. </div>
26. </div>
27. </div>
28. </div>
29. </div>
30. <script src="~/Plugins/bootstrap-4.1.3-dist/js/bootstrap.js"></script>
31. <script>
32. //臉小按鈕
33. Shuxintu.onmousedown = function () {
34. shuxintu.style.display = "none"
35. Biange.onmousedown = function () {
36. shuxintu.style.display = "block"
37. biaoge.style.width = "100%"
38. fenlei.style.width = "100%"
39. }
40. biaoge.style.width = "110%"
41. fenlei.style.width = "110%"
42. }
43. </script>
下圖爲效果圖
