gpt4 book ai didi

html - 带有日期时间选择器的 Bootstrap 看起来+工作不正常

转载 作者:行者123 更新时间:2023-11-28 04:30:48 27 4
gpt4 key购买 nike

我正在使用以下代码,它缩小了每一行,并且由于某种原因整个用户界面也丢失了。我该如何解决?

<!DOCTYPE HTML>
<html>
<head>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen"
href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">


<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>

<script type="text/javascript"
src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script type="text/javascript"
src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
</script>
<script type="text/javascript"
src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
</script>
<script type="text/javascript"
src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
</script>


</head>
<body>


<div class="container-fluid">

<div class="container">

<div class="row">
<div class="col-xs-12 col-sm-12">


<div id="datetimepicker" class="input-append date">
<input type="text"></input>
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
</span>
</div>
</div>

</div>

</div>


<div class="row">
<div class="col-xs-12 col-sm-12">
<input id="text" placeholder="text" type="text" class="form-control"
required="true">
</div>

</div>




</div>

<script type="text/javascript">
$('#datetimepicker').datetimepicker({
format: 'dd/MM/yyyy hh:mm:ss',
language: 'pt-BR'
});
</script>
</body>
<html>

最佳答案

这里有很多问题,我的 friend :

  1. 加载多个版本的 Bootstrap
  2. 在至少一个 Bootstrap js 文件之后加载 jQuery
  3. 至少在 fiddle 中,加载 http 而不是 https
  4. 您尝试使用的 datetimepicker 与 bootstrap 3 不兼容,并且是 no longer maintained .
  5. 您的 html 包含来自旧版和新版 bootstrap 的类。

Here's a somewhat fixed version of your fiddle ,但不要指望它会像您希望的那样实际工作。

关于html - 带有日期时间选择器的 Bootstrap 看起来+工作不正常,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41739907/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com