如何构建自定义网格或查找现有网格

时间:2016-04-15 17:43:33

标签: jquery asp.net-mvc twitter-bootstrap telerik

这是来自Silver Light应用程序的网格。我在ASP.NET MVC中编写另一个需要具有相同外观的应用程序,所以IK问我是否可以在Telerik或Bootstrap或jQuery UI中找到它?如果我必须完全定制它然后我从哪里开始?

enter image description here

1 个答案:

答案 0 :(得分:0)

这是可以代表这样一个框的抽象标记。

<div id="criteria_container" class="search_box">
  <div id="criteria_operations">
    <span id="criteria_add" class="criteria_op">+</span>
    <span id="criteria_subtract" class="criteria_op">-</span>
    <span id="criteria_swap" class="criteria_op">></span>
  </div>
  <div id="criteria_box">
    <div id="criteria_header">Search Criteria</div>
    <div id="criteria_results"></div>
  </div>
</div>

然后,作为开始的地方。

虽然我还没有级联任何CSS样式,但您可能想要。在你这样做之前,请注意许多人将样式嵌套作为semantic issue和某些应用程序中潜在的低效率问题。

 #criteria_container {
   width: 600px;
   height: 100px;
   border: solid 1px black;
 }

 #criteria_operations {
   width: 10px;
   height: 100%;
   float: left;
   background-color: #aaaaaa;
   border: solid 1px black;
 }

 #criteria_header {
   text-align: center;
   background-color: #aaaaaa;
   border: solid 1px black;
 }

 .criteria_op {
 }

 #criteria_box {
   width: 588px;
   float: right;
 }