在 Bootstrap 3 分页和样式问题中添加跳转到页面链接

Question

我正在使用 bootstrap 3 分页。那里没有问题。现在客户想要在分页左侧有一个跳转到页面的功能（请参阅下面的模型图像和 html 以使其看起来像这样）。当我添加跳转以使其正确放置时，它让我很适合。我尝试了一个带有 position:relative 的整体 div 以及带有 position:absolute 的跳转和分页。我尝试了一个 div，只是跳转到不同的位置。我得到的最接近的是将跳转功能添加到分页的 li 中。这仅适用于 a 标记，否则它将移动到分页的右侧。 （抱歉，这里的格式不太习惯）

由于某种原因，如果我删除 a 标记，我无法正确设置样式（删除悬停等），并将其放置在分页的左侧。

这让我非常恼火，因为我知道我错过了一些东西。

我进行了搜索并阅读了一堆无济于事的项目。任何帮助将不胜感激。

这是模型和 html。我使用内联样式只是为了快速查看。

mockup

<ul class="pagination pagination-sm pull-right">
  <li class="form-group input-group-sm"><a style="border:none;margin-top:-10px;">Go to page <input size="4" placeholder="page #"></input><button class="btn btn-primary btn-xs>Go</button></a></li>
  <li><a href="#">&laquo;</a></li>
  <li class="active"><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#">3</a></li>
  <li><a href="#">4</a></li>
  <li><a href="#">5</a></li>
  <li><a href="#">6</a></li>
  <li><a href="#">7</a></li>
  <li><a href="#">8</a></li>
  <li><a href="#">9</a></li>
</ul>

Answer 1

顺便说一句，您的代码有一些错误。但除此之外，不要将表单组放入分页的同一 <ul> 中，因为存在很多样式问题。我认为在分页之外使用 div 中的 go to part input-group 会更容易。

http://www.bootply.com/8RxnexxEtD

删除边距并将显示设置为内联，一切就绪。