問題與<input type =「file」>

我想使一個表單由一個文本類型的輸入字段和其他文件類型組成。問題在於輸入框內顯示文件按鈕。我不希望按鈕在輸入框內。我附上截圖。請幫助我。問題與<input type =「file」>

這是代碼片段。由表單控制類生成

<form class="form-inline fonts-calibri" action="" enctype = "multipart/form-data"> 
     <div class="form-group"> 
     <label for="oid">Purchase Order No. </label> 
     <input type="text" class="form-control" id="oid" placeholder="Enter PO number" name="oid"> 
     </div> 
     <div class="form-group pull-right" style="margin-right : 15%;"> 
     <label for="file">Upload PO </label> 
     <input type = "file" class="form-control" id="file" name = "file" size = "50"/> 
     <span><button type="submit" class="btn btn-default" id="upload-button"><span class="fa fa-upload"></span></button></span> 
    </div>    
</form>

來源

2017-06-23 Joginder Pawan

的框，只需使用下面的代碼刪除盒

<input type = "file" id="file" name = "file" size = "50"/>

你仍然可以添加一些其他的類，如果你需要添加一些造型。

更新：如果您需要表單控件類，然後你可以添加一些類，它

類=「的形式控制試驗」

像這樣和刪除在它的形式，控制箱效應，

.form-control.test { 
    border: none !important; 
    outline: none !important; 
}

來源

2017-06-23 06:25:02 Prateek

問題移除形式控制下課後是固定的，但標籤，瀏覽和上傳按鈕不一行的到來。它們彼此對齊。請幫助 –

您需要從<input type="file" />刪除.form-control類，因爲這班正在製作你不想要的盒子......！

看下面的代碼片段！

.form-group.pull-right input {float: left;} 
 
span {float: left;}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<form class="form-inline fonts-calibri" action="" enctype = "multipart/form-data"> 
 
     <div class="form-group"> 
 
     <label for="oid">Purchase Order No. </label> 
 
     <input type="text" class="form-control" id="oid" placeholder="Enter PO number" name="oid"> 
 
     </div> 
 
     <div class="form-group pull-right" style="margin-right : 15%;"> 
 
     <label for="file">Upload PO </label><div class="clearfix"></div> 
 
     <input type = "file" id="file" name = "file" size = "50"/> 
 
     <span><button type="submit" class="btn btn-default" id="upload-button"><span class="fa fa-upload"></span></button></span> 
 
    </div>    
 
</form>

來源

2017-06-23 06:37:24

謝謝。 \t 刪除表單控件類後，問題得到修復，但標籤，瀏覽和上傳按鈕不在一行中。它們彼此對齊。請幫忙 –

將'float：left;'添加到你想要內聯的所有元素..！ –

問題與<input type =「file」>

回答

相關問題