Css datepicker가 올바르게 표시되지 않습니다.

시간 선택기를 HTML 페이지에 추가하려고합니다. 성공적으로 추가되었지만 시간 텍스트 상자를 클릭하면 시간 선택 도구가 페이지 하단에 나타납니다. 내 CSS에 문제가 있습니까?Css datepicker가 올바르게 표시되지 않습니다.

<head> 
<link rel="stylesheet" type="text/css" href="css/clockpicker.css" /> 
<script type="text/javascript" src = "js/clockpicker.js"> </script> 
</head> 
<body> 
<div class="head_bg clearfix"><!--start head_bg--> 
<div class="outer_div clear_both"><!--start outer_div--> 
    <div class="head_left"><!--start head_left--> 
     <img src="img/logo.png" width="94" height="142" alt="" /><!--Logo here--> 
    </div><!--end head_left--> 
    <div class="head_right"><!--start head_right--> 
     <div class="head_sub01"><!--start head_sub01--> 
      <img src="img/text_img.png" width="397" height="20" alt="" /> 
     </div><!--end head_sub01--> 
     <div class="head_sub02"><!--start head_sub02--> 
      <div class="ul"><!--start ul div--> 
       <ul><!--start ul--> 
        <li><img src="img/signout_icon.png" width="42" height="46" alt="" /></li> 
        <li><img src="img/seperator.png" width="1" height="39" alt="" class="img_padding" /></li> 
        <li><a href="index.html">Sign Out</a></li> 
       </ul><!--end ul--> 
      </div><!--end ul div--> 
     </div><!--end head_sub02--> 
    </div><!--end head_right--> 
</div><!--end outer_div--> 
</div><!--end head_bg--> 
<div class="clear_both height_20px">&nbsp;</div> 
<div class="outer_div clearfix"><!--start outer_div--> 
    <div class="clear_both height_10px">&nbsp;</div> 
    <a href="view_meeting.php" class="btn_a">Back</a> 
    <input type="submit" value="Check Availability and Save" class="btn_all" onclick="this.disabled=true;this.value='Sending, please wait...';this.form.submit();" /> 
    <input type="submit" disabled value="Delete" class="btn_all" /> 
    <div class="clear_both height_5px">&nbsp;</div> 
    <hr /> 
    <div class="clear_both height_5px">&nbsp;</div> 
    <span class="font_15px color_official"><b>Subject</b></span> 
    <input type="text" required class="txt_input02" name = "abc" /> <!-- imam --> 
    <span class="font_15px color_official"><b>Name</b></span> 
    <input type="text" required class="txt_input07" name = "name" value = "<?php echo htmlentities($_SESSION['fullName']); ?>"/> 
    <span class="font_15px color_official"><b>Dept</b></span> 

    <input type="text" required class="txt_input06" name = "dept" value = "<?php echo htmlentities($_SESSION['dep']); ?>"/> 

    <div class="clear_both height_10px" >&nbsp;</div> 
    <span class="color_official"><b>From</b></span> 
    <input type="text" required name="date_txt" id="datepicker-example1" class="txt_input03" />&nbsp;  
    <span class="color_official"><b>To</b></span> 

    <input type="text" required name="date_txt1" id="datepicker-example2" class="txt_input03" />&nbsp; 
    <span class="color_official"><b>Time In</b></span> 

    <input type = "text" required class="txt_input03" name ="timeIn" id = "timeIn" placeholder="00:00"/>&nbsp; 

    <script type="text/javascript"> 

    var input = $('#timeIn'); 
    input.clockpicker({autoclose: true}); 

    </script> 
</body>

은 다음과 같이 나타납니다 :

enter image description here

출처

2014-11-18 user3202144

를 가져올 필요하고 어디 CSS입니다! – dm4web

부트 스트랩 Timepicker을 jsfiddle

는 CSS를

@import url('//netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css'); 
@import url('http://jdewit.github.io/bootstrap-timepicker/css/bootstrap-timepicker.min.css');

출처

2014-11-18 08:23:44

Css datepicker가 올바르게 표시되지 않습니다.

답변

관련 문제