Question

在第一列中，是否可以使用标签而不是按钮？在视觉上我想要一个标签或按钮，但我不想它是可点击的。文字也出来了。我试图让按钮变小，但它不接受width。

<div>
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title"><span>AA</span></h4>
            </div>
            <div class="modal-body">
                <form role="form" class="container-fluid">
                    <div class="form-group col-md-6">
                        <label>Text</label>
                        <div class="btn-group btn-group-justified">
                            <a href="#"  class="btn btn-warning">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla laoreet eget neque</a>
                            <a href="" class="btn btn-warning">BUTTON</a>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <label>Text 2</label>
                        <div class="btn-group btn-group-justified">
                            <a href="" class="btn btn-warning">BUTTON 2</a>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <a class="btn btn-default" href="#">Cancelar</a>
            </div>
        </div>
    </div>
</div>

Answer 1

视觉上我想要一个标签或一个按钮，但我不想这样做是可点击的。

最好的方法是在元素上添加disabled属性。然后使用您自己的类

取消降低的不透明度

<强> HTML

<a href="#" class="btn btn-warning myClass btn-sm" disabled>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla laoreet eget neque</a>

<强> CSS

.myClass[disabled] {
    opacity: 1;
}

文字也出来了。

只需将其添加到上面的CSS规则集

即可

white-space: normal;

我试图让按钮更小但是它不接受宽度。

btn-group-justified类中btn的显示是table-cell，所有列的宽度都设置为1％。所以你必须设置你的宽度，记住1％是默认值。

例如，对于2列按钮组，以下内容为25％

width: 0.5%;

完整的CSS将是

.myClass[disabled] {
    opacity: 1;
    white-space: normal;
    width: 0.5%;
}

小提琴 - http://jsfiddle.net/wr78t8ug/

在网格中使用标签和按钮

1 个答案: