ASP.NET TextBox 服务器控件中的 Font Awesome 实现
Font Awesome Implementation into ASP.NET TextBox Server Control
http://www.petcenters.com/painting-estimate 是一个测试页,其中 Bootstrap 启用 ASP.NET 控件使用 CssClass 选择器。
我已尝试将 Font Awesome 类 实施到 ASP.NET TextBox 控件中,遵循以下说明的指南:
Bootstrap Documentation
<div class="input-group">
<input type="text" class="form-control" placeholder="Recipient's username" aria-describedby="basic-addon2">
<span class="input-group-addon" id="basic-addon2">@example.com</span>
</div>
我正在使用的 Bootstrap 模板显示了它们的实现:Font Awesome with HTML Form Tags
<section class="col col-6">
<label class="label">Company</label>
<label class="input">
<i class="icon-append fa fa-envelope-o"></i>
<input type="text" name="company" id="company">
</label>
</section>
我已尝试使用 ASP.NET 文本框服务器控件的两种方案进行复制。
<div class="input-group col-md-6 clearfix">
<label for="txtGenCompany">Company</label>
<asp:TextBox ID="txtGenCompany" name="company" CssClass="form-control" aria-describedby="addon1" placeholder="Enter Company" runat="server" TabIndex="2"></asp:TextBox>
<span class="input-group-addon" id="addon1">
<i class="icon-append fa fa-envelope-o"></i>
</span>
</div>
我想我在 "span" 或 "i" Company TextBox
中遗漏了什么
如果有人有任何想法,我将不胜感激。
你需要的是
HTML
<div class="input-group input-group-md">
<lable>Company</lable>
<asp:TextBox ID="txtGenCompany" name="company" CssClass="form-control" aria-describedby="addon1" placeholder="Enter Company" runat="server" TabIndex="2"></asp:TextBox>
<span class="input-group-addon"><i class="fa fa-envelope-o"></i></span>
</div>
CSS
lable {
display: table-caption;
white-space: nowrap;
}
.input-group {
padding-bottom: 20px;
}
PS: 有太多的视觉指南来获取输入是不好的,
这里我们有 3:
- 标签
- 占位符
- 字体很棒的图标
如果可以的话尽量减少它们。
http://www.petcenters.com/painting-estimate 是一个测试页,其中 Bootstrap 启用 ASP.NET 控件使用 CssClass 选择器。
我已尝试将 Font Awesome 类 实施到 ASP.NET TextBox 控件中,遵循以下说明的指南: Bootstrap Documentation
<div class="input-group">
<input type="text" class="form-control" placeholder="Recipient's username" aria-describedby="basic-addon2">
<span class="input-group-addon" id="basic-addon2">@example.com</span>
</div>
我正在使用的 Bootstrap 模板显示了它们的实现:Font Awesome with HTML Form Tags
<section class="col col-6">
<label class="label">Company</label>
<label class="input">
<i class="icon-append fa fa-envelope-o"></i>
<input type="text" name="company" id="company">
</label>
</section>
我已尝试使用 ASP.NET 文本框服务器控件的两种方案进行复制。
<div class="input-group col-md-6 clearfix">
<label for="txtGenCompany">Company</label>
<asp:TextBox ID="txtGenCompany" name="company" CssClass="form-control" aria-describedby="addon1" placeholder="Enter Company" runat="server" TabIndex="2"></asp:TextBox>
<span class="input-group-addon" id="addon1">
<i class="icon-append fa fa-envelope-o"></i>
</span>
</div>
我想我在 "span" 或 "i" Company TextBox
中遗漏了什么如果有人有任何想法,我将不胜感激。
你需要的是
HTML
<div class="input-group input-group-md">
<lable>Company</lable>
<asp:TextBox ID="txtGenCompany" name="company" CssClass="form-control" aria-describedby="addon1" placeholder="Enter Company" runat="server" TabIndex="2"></asp:TextBox>
<span class="input-group-addon"><i class="fa fa-envelope-o"></i></span>
</div>
CSS
lable {
display: table-caption;
white-space: nowrap;
}
.input-group {
padding-bottom: 20px;
}
PS: 有太多的视觉指南来获取输入是不好的, 这里我们有 3:
- 标签
- 占位符
- 字体很棒的图标
如果可以的话尽量减少它们。