列的空间太大

时间:2015-06-06 23:26:24

标签: css twitter-bootstrap

我使用twitter bootstrap 3.我创建了一个2列页面。

<body>
    <div class="container-fluid">
        <div class="row-fluid">
            <div class="col-sm-2 column menu_side">
            left ...
            </div>
        </div>
         <div id="main" class="col-sm-10 column">
         right....
         </div>
   </div>

too much space for the left column

就像你可以看到的那样,左侧部分占据了很大的空间。我希望能够比文本大小多一点。

我试图减少到col-sm1,但文本被分成两行。

是否有技术可以解决这个问题?

1 个答案:

答案 0 :(得分:0)

使用HTML时,我发现如果您使用CSS,则可以指定<div>标记的宽度和高度。为此,您将在同一文件或单独的.css样式页面中创建一段代码ether。

如果您选择将代码放在同一页面上,则可以在<head> </head>代码之间添加以下代码:

<style type="text/css">
div {
width: (xxx)px;
//replace the (xxx) with the size of the container you would like to have in pixels (or you can replace the pixel number with a percentage)
}
</style>

或者,您可以创建一个新的.css文件,其中包含以下代码:

@charset "utf-*";
div {
    width: (xxx)px;
// again you would replace the (xxx) with the number of pixels you want the width to be or replace the (xxx)px with the percentage of the page you want the container to take up
}

如果您选择使用单独的CSS文件,则可以在要修改的任何页面的<head> </head>标记之间添加以下代码:

<link href="styles.css" rel="stylesheet">

你会用你名字.css文件

取代“styles.css”

希望这有帮助,因为我之前没有使用过bootstrap