首页 > 解决方案 > CSS 适用于 HTML 但不适用于 Razor 语法

问题描述

我正在制作联系表格,起初它是纯 html:

<div id="contact-container">
<form class="cf">
    <div class="half left cf">
        <input type="text" id="input-name" placeholder="Name">
        <input type="email" id="input-email" placeholder="Email address">
        <input type="tel" id="input-phone" placeholder="Phone">
        <input type="text" id="input-subject" placeholder="Subject">
    </div>
    <div class="half right cf">
        <textarea name="message" type="text" id="input-message" placeholder="Message"></textarea>
    </div>
    <input type="submit" value="Submit" id="input-submit">
</form>
</div>

但是,当我将其转换为 Razor 语法时:

<div id="contact-container">
@Html.BeginForm("Contact", "Service", FormMethod.Post, new { @class = "cf" })
{
    <div class="half left cf">
        @Html.TextBoxFor(m => m.Name, new { htmlattributes = new { id = "input-name", placeholder = "Name" }})
        @Html.TextBoxFor(m => m.Email, new { htmlattributes = new { id = "input-email", placeholder = "Email Address" }})
        @Html.TextBoxFor(m => m.Phone, new { htmlattributes = new { id = "input-phone", placeholder = "Phone" }})
        @Html.TextBoxFor(m => m.Subject, new { htmlattributes = new { id = "input-subject", placeholder = "Subject" }})
    </div>
    <div class="half right cf">
        @Html.TextBoxFor(m => m.Message, new { htmlattributes = new { id = "input-message", placeholder = "Message" }})
    </div>
    <input type="submit" value="Submit" id="input-submit">
}
</div>

它看起来完全不同,网页上有诸如System.Web.Mvc.Html.MvcForm {和一堆分号之类的随机文本。我在这里想念什么?

标签: htmlcssrazor

解决方案


您需要using在表单创建周围添加,例如:

<div id="contact-container">
@using (Html.BeginForm("Contact", "Service", FormMethod.Post, new { @class = "cf" })
{
    <div class="half left cf">
        @Html.TextBoxFor(m => m.Name, new { htmlattributes = new { id = "input-name", placeholder = "Name" }})
        @Html.TextBoxFor(m => m.Email, new { htmlattributes = new { id = "input-email", placeholder = "Email Address" }})
        @Html.TextBoxFor(m => m.Phone, new { htmlattributes = new { id = "input-phone", placeholder = "Phone" }})
        @Html.TextBoxFor(m => m.Subject, new { htmlattributes = new { id = "input-subject", placeholder = "Subject" }})
    </div>
    <div class="half right cf">
        @Html.TextBoxFor(m => m.Message, new { htmlattributes = new { id = "input-message", placeholder = "Message" }})
    </div>
    <input type="submit" value="Submit" id="input-submit">
}
</div>

推荐阅读