                        課程
                    
                        /前端開發(fā)
                        
                            /Bootstrap
                        
                        /玩轉(zhuǎn)Bootstrap（基礎(chǔ)）

求解，沒有水平?。?/h1>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>全局樣式</title>
<link rel="stylesheet" >
</head>

<body>
<form class="form-horizontal" role="form">
? <div class="form-group">
? ? <label for="firstname" class="col-sm-2 control-label">名字</label>
? ? <div class="col-sm-10">
? ? ? <input type="text" class="form-control" id="firstname" placeholder="請輸入名字">
? ? </div>
? </div>
? <div class="form-group">
? ? <label for="lastname" class="col-sm-2 control-label">姓</label>
? ? <div class="col-sm-10">
? ? ? <input type="text" class="form-control" id="lastname" placeholder="請輸入姓">
? ? </div>
? </div>
? <div class="form-group">
? ? <div class="col-sm-offset-2 col-sm-10">
? ? ? <div class="checkbox">
? ? ? ? <label>
? ? ? ? ? <input type="checkbox">請記住我
? ? ? ? </label>
? ? ? </div>
? ? </div>
? </div>
? <div class="form-group">
? ? <div class="col-sm-offset-2 col-sm-10">
? ? ? <button type="submit" class="btn btn-default">登錄</button>
? ? </div>
? </div>
</form>
</body>
</html>

以氣御碼

2018-05-28

源自：玩轉(zhuǎn)Bootstrap（基礎(chǔ)） 3-1

關(guān)注問題我要回答

1229

操作

收起

2 回答

qq_魚_64
2018-06-08

由于form-control類里面定義的是 width:100%;display:block;?所以肯定是input占據(jù)一行的，你想要讓標簽和input放在一行里面，直接修改input的樣式,width:200px;display:inline就可以了。當然你也可以直接用網(wǎng)格布局，用container容器包裹row，然后在row中包裹col就可以了