Asp.net mvc MVC创建药丸网格（数据库中每行一个）

我正在创建一个视图，它需要一个显示车辆状态的仪表板。 我希望数据库中的每辆车都有一个避孕药，避孕药的颜色将指示车辆的状态，即良好、一般、不良，避孕药的文本将是车辆钥匙号

我想让药片以网格的方式排列，以最大限度地利用可用空间。数据库中车辆的行数未知，但通常在40到50之间

---

我在EF6中使用MVC5，在web开发方面相当缺乏经验。有没有关于实现这一目标的最佳方法的想法？链接到任何示例或教程都很好。

创建一个Html帮助程序，该帮助程序接受状态id

namespace StackOverflowWQuestion.Helpers
{
 public static class MyHTMLHelpers
 {
      public static string PillHelper(this HtmlHelper helper, int statusId)
      {
          string htmlString = "";
          switch (caseSwitch)
          {
           case 1:
               htmlString = "<img src="pill-good.png" /> ;
               break;
           case 2:
               htmlString = "<img src="pill-bad.png" /> ;
               break;
         default:
               htmlString = "<img src="pill-fair.png" /> ;
               break;
          }

          return htmlString;
      }
}

我假设您的数据中有一个名为StatusId的值，它是状态表中的外键

教程在这里使用旧的视图引擎；如果你只是谷歌asp.net mvc html助手教程，你会发现很多结果

---

谢谢，这让我走上了正确的道路。另一个让我抓狂的部分是视图中的布局。我想有一个布局，把药丸或徽章到一个网格或多列列表。问题是我不知道在设计时会有多少。有什么想法吗？你为什么不能用桌子？创建一个表标题行，然后循环模型中的每辆车以添加每一行。我建议您阅读这里的初学者教程

@Html.PillHelper(Model.StatusId)