Question

我正在寻找有关如何使用预先存在的元素改进默认/生成的ASP.Net MVC视图的建议。

我有一个有很多表单的应用程序，我希望不用在每个表单上花太多时间来改善他们的外观，只是应用一个样式集。

有没有办法在下面的样式中添加列？

<style type="text/css"> 
form      
{
    background-color: #f3f3f3;     
    border: solid 1px #a1a1a1;     
    padding: 10px;     
    width: 300px; 
}  

.editor-label, .editor-field 
{     
    display: block;     
    width: 120px;     
    float: left;     
    margin-bottom: 10px; 
}  

.editor-label      
{
    text-align: right;     
    padding-right: 20px; 
}  

br      
{
    clear: left; 
}

</style>

Answer 1

为了实现列结构，您需要使用更多HTML元素。您可能必须编辑T4模板，以便在创建视图时为您生成其他标记。

另一种可能性是通过jQuery逐步增强布局。此示例使用DIV包装每个标签和字段，以便您可以使用更多内容。您可以轻松扩展此选项以应用您选择的列系统。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('.editor-label').each(function () {
            var $labelAndField = $(this).add($(this).next('.editor-field'));
            $labelAndField.wrapAll('<div class="field" />');
        });
    });
</script>

如何在生成的ASP.Net MVC表单视图中的预先存在的元素上实现列样式？

1 个答案: