章节
问答
课签
笔记
评论
占位
占位

表单控件(输入框input)

每一个表单都是由表单控件组成。离开了控件,表单就失去了意义。接下来的我们简单的来了解Bootstrap框架中表单控件的相关知识。

单行输入框,常见的文本输入框,也就是inputtype属性值为text。在Bootstrap中使用input时也必须添加type类型,如果没有指定type类型,将无法得到正确的样式,因为Bootstrap框架都是通过input[type=“?”](其中?号代表type类型,比如说text类型,对应的是input[type=“text”])的形式来定义样式的。

为了让控件在各种表单风格中样式不出错,需要添加类名“form-control”,如:

<form role="form">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter email">
</div>
</form>
运行效果如下或查看右侧结果窗口:

 

任务

我也来试试:完成下面任务

在右侧代码编辑器中写入一个单行文本框,用于输入用户名。

?不会了怎么办

正确代码如下:

<form role="form">
  <div class="form-group">
    <input type="email" class="form-control" placeholder="Enter email">
    <input type="text" class="form-control" placeholder="Enter Username">
  </div>
</form>

备注:这一小节没有正确性验证,请查看结果窗口,从而判断输入代码是否正确。

 

||

提问题

写笔记

公开笔记
提交
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布
全部 我要发布
最热 最新
只看我的

手记推荐

更多

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?