如果你想要一些不会破坏相对设计的东西，试试这个:

body .modal {
  width: 90%; /* desired relative width */
  left: 5%; /* (100%-width)/2 */
  /* place center */
  margin-left:auto;
  margin-right:auto; 
}

正如@Marco Johannesen所说，选择器之前的“主体”是为了让它具有比默认更高的优先级。

如果Bootstrap>3，只需添加样式到您的模式。

<div class="modal-dialog" style="width:80%;">
  <div class="modal-content">
  </div>
</div>

修改类模型对话框可以达到预期的结果。这些小技巧对我很有用。希望能帮助你解决这个问题。

.modal-dialog {
    width: 70%;
}

尝试以下内容(参见jsfiddle示例:http://jsfiddle.net/periklis/hEThw/1/)

<a class="btn" onclick = "$('#myModal').modal('show');$('#myModal').css('width', '100px').css('margin-left','auto').css('margin-right','auto');" ref="#myModal" >Launch Modal</a>
<div class="modal" id="myModal" style = "display:none">
  <div class="modal-header">
    <a class="close" data-dismiss="modal">×</a>
    <h3>Modal header</h3>
  </div>
  <div class="modal-body">
    <p>One fine body…</p>
  </div>
  <div class="modal-footer">
    <a href="#" class="btn">Close</a>
    <a href="#" class="btn btn-primary">Save changes</a>
  </div>
</div>​

更新:

在引导3中，你需要改变模式对话框。 所以在这种情况下，你可以在modal-dialog所在的位置添加类modal-admin。

原始答案(Bootstrap < 3)

是否有特定的原因，你试图改变它与JS/jQuery?

只需CSS就可以轻松完成，这意味着您不必在文档中进行样式化。 在您自己的自定义CSS文件中，您添加:

body .modal {
    /* new custom width */
    width: 560px;
    /* must be half of the width, minus scrollbar on the left (30px) */
    margin-left: -280px;
}

在你的情况下:

body .modal-admin {
    /* new custom width */
    width: 750px;
    /* must be half of the width, minus scrollbar on the left (30px) */
    margin-left: -375px;
}

我把body放在选择器之前的原因是，它的优先级比默认值更高。通过这种方式，您可以将其添加到自定义CSS文件中，并且无需担心更新Bootstrap。

供参考，Bootstrap 3自动处理左侧属性。所以简单地添加这个CSS将改变宽度并保持居中:

.modal .modal-dialog { width: 800px; }