Twitter bootstrap 控件未正确显示_Twitter Bootstrap_Image Gallery_Twitter Bootstrap 3_Blueimp

Twitter bootstrap 控件未正确显示

twitter-bootstrap twitter-bootstrap-3

Twitter bootstrap 控件未正确显示,twitter-bootstrap,image-gallery,twitter-bootstrap-3,blueimp,Twitter Bootstrap,Image Gallery,Twitter Bootstrap 3,Blueimp,我已经按照设定的说明进行了操作&所有操作都几乎完美无瑕，但gallery控件没有正确显示。“上一个”和“下一个”按钮的尖括号位置不正确我已查找CSS冲突，但找不到任何冲突，我尝试删除除blueimp-gallery.min.CSS以外的所有CSS 我会用错字符吗和> 下面是我的HTML&a屏幕截图谢谢 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-

我已经按照设定的说明进行了操作&所有操作都几乎完美无瑕，但gallery控件没有正确显示。“上一个”和“下一个”按钮的尖括号位置不正确

我已查找CSS冲突，但找不到任何冲突，我尝试删除除blueimp-gallery.min.CSS以外的所有CSS

我会用错字符吗和>

下面是我的HTML&a屏幕截图

谢谢

<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen" />
<link rel="stylesheet" href="css/blueimp-gallery.min.css">    
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="css/sticky-footer.css" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="../../assets/js/html5shiv.js"></script>
  <script src="../../assets/js/respond.min.js"></script>
<![endif]-->
</head>

<body>
<div id="wrap">
  <div class="container">
    <nav class="navbar navbar-default" role="navigation">
    <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="index.html"><img src="logo.png" alt="aka knits logo" class="logo"/></a>
      </div>

      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse navbar-ex1-collapse">
        <ul class="nav navbar-nav">
          <li><a href="index.html">home</a></li>
          <li><a href="about.html">about</a></li>
          <li class="active"><a href="gallery.html">gallery</a></li>
          <li><a href="contact.html">contact</a></li>
        </ul>

        <ul class="nav navbar-nav pull-right nav-pills">
          <!-- http://fortawesome.github.io/Font-Awesome/icons/#brand -->
          <li><a href="#"><i class="icon-envelope icon-1x"></i></a></li>
          <li><a href="#"><i class="icon-facebook icon-1x"></i></a></li>
          <li><a href="#"><i class="icon-twitter icon-1x"></i></a></li>
          <li><a href="#"><i class="icon-linkedin icon-1x"></i></a></li>
          <li><a href="#"><i class="icon-google-plus icon-1x"></i></a></li>
        </ul>
      </div><!-- /.navbar-collapse -->
    </nav>

    <!-- The Gallery as lightbox dialog, should be a child element of the document body -->
    <div id="blueimp-gallery" class="blueimp-gallery">
        <div class="slides"></div>
        <h3 class="title"></h3>
        <a class="prev"><</a>
        <a class="next">></a>
        <a class="close">x</a>
        <a class="play-pause"></a>
        <ol class="indicator"></ol>
    </div>

    <div id="links">
        <a href="img/gallery/banana.jpg" title="Banana">
            <img src="img/gallery/thumbnails/banana.jpg" alt="Banana">
        </a>
        <a href="img/gallery/apple.jpg" title="Apple">
            <img src="img/gallery/thumbnails/apple.jpg" alt="Apple">
        </a>
        <a href="img/gallery/orange.jpg" title="Orange">
            <img src="img/gallery/thumbnails/orange.jpg" alt="Orange">
        </a>
    </div>

  </div>
</div>

<div id="footer">
  <div class="container">
    <p class="text-muted credit">Footer goes here with a  <a href="#">Link</a> if required</p>
  </div>
</div>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/blueimp-gallery.min.js"></script>
<script>
  document.getElementById('links').onclick = function (event) {
      event = event || window.event;
      var target = event.target || event.srcElement,
          link = target.src ? target.parentNode : target,
          options = {index: link, event: event},
          links = this.getElementsByTagName('a');
      blueimp.Gallery(links, options);
  };
</script>


切换导航













如果需要，页脚会带一个
document.getElementById（'links'）.onclick=函数（事件）{
event=event | | window.event；
var target=event.target | | event.src元素，
link=target.src？target.parentNode:target，
选项={index:link，event:event}，
links=this.getElementsByTagName（'a'）；
blueimp.Gallery（链接、选项）；
};

是的，您使用了错误的字符。看：正如你所看到的，这个标志有点小

您必须使用：

关闭：

×

下一步：

&rsaquo
上一篇：&lsaqo
谢谢Bass，它工作得很好。我曾经尝试过从中复制和粘贴，但没有成功，但是上面的角色实体成功了，谢谢：）