想要在按钮之间添加间距
Want to add spacing between buttons
我有一个简单的任务是在对话框中的按钮之间添加 space,就像下面从 http://bootboxjs.com/examples.html 获得的示例代码一样。想象一下,这个例子有多个按钮。喜欢保存、删除、取消、确认。
bootbox.dialog({
title: "This is a form in a modal.",
message: '<div class="row"> ' +
'<div class="col-md-12"> ' +
'<form class="form-horizontal"> ' +
'<div class="form-group"> ' +
'<label class="col-md-4 control-label" for="name">Name</label> ' +
'<div class="col-md-4"> ' +
'<input id="name" name="name" type="text" placeholder="Your name" class="form-control input-md"> ' +
'<span class="help-block">Here goes your name</span> </div> ' +
'</div> ' +
'<div class="form-group"> ' +
'<label class="col-md-4 control-label" for="awesomeness">How awesome is this?</label> ' +
'<div class="col-md-4"> <div class="radio"> <label for="awesomeness-0"> ' +
'<input type="radio" name="awesomeness" id="awesomeness-0" value="Really awesome" checked="checked"> ' +
'Really awesome </label> ' +
'</div><div class="radio"> <label for="awesomeness-1"> ' +
'<input type="radio" name="awesomeness" id="awesomeness-1" value="Super awesome"> Super awesome </label> ' +
'</div> ' +
'</div> </div>' +
'</form> </div> </div>',
buttons: {
success: {
label: "Save",
className: "btn-success",
callback: function () {
var name = $('#name').val();
var answer = $("input[name='awesomeness']:checked").val()
Example.show("Hello " + name + ". You've chosen <b>" + answer + "</b>");
}
}
}
}
);
我想知道如何增加按钮之间的间距,使按钮之间的间距更远,看起来更宽敞,对话框UI也更漂亮。我不太擅长这些东西。我已经搜索了很多。请帮我。非常感谢您的帮助。非常感谢。
如果可能,请提供一些代码和实例。再次感谢。
您可以使用
或 margin
属性 在网页上添加按钮之间的间距。
使用
:
您可以在第一个按钮的结束标记和第二个按钮的开始标记之间使用
,如下所示。
<button>Button 1</button> <button>Button 2</button>
您可以添加更多
以添加更多 space。
使用 margin
属性:
您可以通过在其两侧添加 margin
来增加两个对象之间的间距。 CSS代码如下,
.btn_name{
margin-left:10px;
}
在左侧添加space,或者您可以使用以下代码在右侧添加space,
.btn_name{
margin-right:10px;
}
我有一个简单的任务是在对话框中的按钮之间添加 space,就像下面从 http://bootboxjs.com/examples.html 获得的示例代码一样。想象一下,这个例子有多个按钮。喜欢保存、删除、取消、确认。
bootbox.dialog({
title: "This is a form in a modal.",
message: '<div class="row"> ' +
'<div class="col-md-12"> ' +
'<form class="form-horizontal"> ' +
'<div class="form-group"> ' +
'<label class="col-md-4 control-label" for="name">Name</label> ' +
'<div class="col-md-4"> ' +
'<input id="name" name="name" type="text" placeholder="Your name" class="form-control input-md"> ' +
'<span class="help-block">Here goes your name</span> </div> ' +
'</div> ' +
'<div class="form-group"> ' +
'<label class="col-md-4 control-label" for="awesomeness">How awesome is this?</label> ' +
'<div class="col-md-4"> <div class="radio"> <label for="awesomeness-0"> ' +
'<input type="radio" name="awesomeness" id="awesomeness-0" value="Really awesome" checked="checked"> ' +
'Really awesome </label> ' +
'</div><div class="radio"> <label for="awesomeness-1"> ' +
'<input type="radio" name="awesomeness" id="awesomeness-1" value="Super awesome"> Super awesome </label> ' +
'</div> ' +
'</div> </div>' +
'</form> </div> </div>',
buttons: {
success: {
label: "Save",
className: "btn-success",
callback: function () {
var name = $('#name').val();
var answer = $("input[name='awesomeness']:checked").val()
Example.show("Hello " + name + ". You've chosen <b>" + answer + "</b>");
}
}
}
}
);
我想知道如何增加按钮之间的间距,使按钮之间的间距更远,看起来更宽敞,对话框UI也更漂亮。我不太擅长这些东西。我已经搜索了很多。请帮我。非常感谢您的帮助。非常感谢。
如果可能,请提供一些代码和实例。再次感谢。
您可以使用
或 margin
属性 在网页上添加按钮之间的间距。
使用
:
您可以在第一个按钮的结束标记和第二个按钮的开始标记之间使用
,如下所示。
<button>Button 1</button> <button>Button 2</button>
您可以添加更多
以添加更多 space。
使用 margin
属性:
您可以通过在其两侧添加 margin
来增加两个对象之间的间距。 CSS代码如下,
.btn_name{
margin-left:10px;
}
在左侧添加space,或者您可以使用以下代码在右侧添加space,
.btn_name{
margin-right:10px;
}