2016-11-18 99 views
0

我目前正在實現一個範圍滑塊,並在位於滑塊正上方的滑塊的開始處有一個標籤。這個標籤代表了比例的低端。現在我需要在滑塊末尾的相同位置添加一個標籤來表示刻度的最高端。但是,我只能將標籤顯示在比例尺的開頭,但在底部。我使用CSS的Bootstrap。將標籤添加到HTML範圍滑塊的末端

<div class="container"> 
     <label for="agitated">Agitated</label> 
     <input type="range" min="0" max="10" value="5" id="fader"> 
     </br> 

     <label for="happy">Happy</label> 
     <input type="range" min="0" max="10" value="5" id="fader"> 
     </br> 

     <label for="tired">Tired</label> 
     <input type="range" min="0" max="10" value="5" id="fader"> 
     </br> 

     <label for="scared">Scared</label> 
     <input type="range" min="0" max="10" value="5" id="fader"> 
    </div> 
+0

我不知道如果我理解你的權利,但也許[這](https://jsfiddle.net/okyf0omz/)可以幫助您? – theoretisch

+0

看到這就是我最初嘗試。顯然這是最明顯的嘗試。但是,這是它爲我提供的。 http://imgur.com/162oODQ – xiimoss

+0

也許這樣的東西可以適合:https://jsfiddle.net/okyf0omz/3/ – Julo0sS

回答

0
<label for="happy" class="pull-left">Happy</label> 
<label for="" class="pull-right">Sad</label> 
<input type="range" min="0" max="10" value="5" id="fader"> 
</br> 

像這樣的事情?如果是這樣的話,只需對每個標籤使用引導類pull-leftpull-right

這裏是例子:

http://jsbin.com/ziluwuv/1/edit?output

+0

謝謝你這個工作! – xiimoss

+0

請將您的代碼發佈在您的答案中,而不是可能在任何時候無法訪問,無法訪問或消失的第三方網站,而讓您的答案對其他訪問者無用。 – j08691