它真的需要5吗?我问,因为每个标签都会有不同的宽度,所以无论如何它看起来都很粗糙。如果你有5个长标签相邻,他们可能会流入为其他东西保留的空间,这就是为什么我认为你在说5列。
你可能最终会看到一个蔬菜标签出现在蔬菜贴上的标签。然后,蔬菜和它的立柱之间会有巨大的差距。看起来有点奇怪。
我用了一个免费的。尽管我忘记了它来自哪里,但包含在这里。
希望这会有所帮助。
这是助手
public static class MVCTagList
{
public static string TagList(this HtmlHelper helper, IEnumerable<String> tagListItems, object htmlAttributes)
{
StringBuilder TagListMarkup = new StringBuilder();
TagListMarkup.Append("<ul");
if (htmlAttributes != null) TagListMarkup.Append(" " + htmlAttributes.ToAttributeList());
TagListMarkup.Append(">");
foreach (string tagListItem in tagListItems)
{
TagListMarkup.Append("<li>");
TagListMarkup.Append(String.Format("<a href='/Articles/?tag={0}'>{0}</a>", tagListItem));
TagListMarkup.Append("</li> ");
}
TagListMarkup.Append("</ul>");
return TagListMarkup.ToString();
}
}
这是HTML
<div style="width:450px; margin-left:50px; ">
<%
List<String> TagListItems = new List<string>();
foreach (var tag in Model)
TagListItems.Add(tag.keyword1);
%>
<%= Html.TagList(TagListItems.AsEnumerable(), new { @class="TagList" })%>
</div>
而CSS
.TagList { margin: 0 0 0 0; padding: 0 0 0 0; }
.TagList li { display:inline; border:1px solid; background-color:#316AC5; margin-left:3px; padding: 3px 3px 3px 3px; line-height:2em;}
.TagList li a { text-decoration:none; color: white; font-size:85%; white-space:nowrap; }
我爱的优先处理核准对丑陋的代码感到内疚。 – JustinStolle 2010-05-27 04:48:48