Question

我使用Visual Studio 2013创建了默认的Web项目。我能够运行创建的默认项目。我正在尝试调整width的{{1}}并将其从默认大小增加。

我添加了一个新页面，并按如下方式放置form

div

我创建了一个自定义样式表并添加到页面中。样式表的内容如下

<div class=container-fluid">
<div>

如果我将缩小.container-fluid { margin-right: auto; margin-left: auto; max-width: 1600px; }更改为max-width，则屏幕显示为小。如果将其增加到更高的值，它不会超出附图中显示的宽度。我正在使用400

Answer 1

Bootstrap会帮助你。

有两个容器类可供选择：

.container类提供响应式固定宽度容器
.container-fluid类提供一个全宽度容器，跨越视口的整个宽度

注意：容器不可嵌套（您不能将容器放入其中另一个容器）。

以下示例显示了基本Bootstrap页面的代码（带有全宽容器）：

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container-fluid">
  <h1>My First Bootstrap Page</h1>
  <p>This part is inside a .container-fluid class.</p>
</div>

</body>
</html>

使用样式表设置Web表单的宽度

1 个答案: