我正在使用Bootstrap 2(以前的Twitter),我想将按钮的样式设置为普通链接。但不只是普通的链接;这些将被放入<ul class="nav nav-tabs nav-stacked">
容器中。标记将像这样结束:
<form action="..." method="post">
<div class="row-fluid">
<!-- Navigation for the form -->
<div class="span3">
<ul class="nav nav-tabs nav-stacked">
<li><button type="submit" name="op" value="Link 1">Link 1</button></li>
<li><button type="submit" name="op" value="Link 2">Link 2</button></li>
<!-- ... -->
</ul>
</div>
<!-- The actual form -->
<div class="span9">
<!-- ... -->
</div>
</div>
</form>
Bootstrap有没有办法让这些<button>
看起来像实际上是<a>
?
8条答案
按热度按时间e5nqia271#
只是使常规链接看起来像按钮:)
“role”里面的一段href代码让它看起来像button,ofc你可以添加更多的变量比如class。
oug3syen2#
只需将remove_button_css作为class添加到按钮标记中。您可以验证链接1的代码
额外样式编辑
添加
color: #337ab7;
、:hover
和:focus
以匹配OOTB( Bootstrap 3)irtuqstp3#
在bootstrap 3中,这对我来说很好:
使用方式:
Demo
krugob8w4#
只是摆脱了背景颜色,边界和添加悬停效果。这里有一个小提琴:http://jsfiddle.net/yPU29/
CSS:
8mmmxcuj5#
我已经尝试了所有的例子,张贴在这里,但他们不工作,没有额外的CSS。试试这个:
完美的工作,没有任何额外的CSS。
piwo6bdm6#
在react-bootstrap中,
shadow-none
在单击后摆脱突出显示。text-start
停止文本居中。vs3odd8k7#
下面是一个例子:
CSS风格:
这只是一个例子,并根据您的情况/需求进行更改。
希望这对你有帮助。
w8biq8rn8#
如官方文档中所述,只需应用类
btn btn-link
:例如,使用您提供的代码: