0

我正在使用最新版本的 Bootstrap 构建一个网站，除了一些小问题外，大部分情况都很好。

主要的是我的清单。我有两个列表可以正常工作到 768px 宽。之后，即使有足够的空间让它们内联显示，它们也会堆叠。

这只是我想要整理的一件烦人的小事。

我的清单代码：

<!DOCTYPE html>
<html lang="en">
<head>

    <link href="css/bootstrap.css" rel="stylesheet" type="text/css">
    <link href="css/bootstrap-responsive.css" rel="stylesheet" type="text/css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AGHicks Homepage</title>
    <link href="css/stylesheet.css" rel="stylesheet" type="text/css">
</head>
<body>

            <div class="row-fluid">
                <div class="span5">
                    <ul>
                        <li><strong>Conservatories</strong></li>
                        <li><strong>Extensions</strong></li>
                        <li><strong>Window & Door Refits</strong></li>
                        <li><strong>Bricklaying</strong></li>
                        <li><strong>Driveways</strong></li>
                        <li><strong>Carpentry</strong></li>
                        <li><strong>Patios</strong></li>
                        <li><strong>Stonework</strong></li>
                    </ul>
                </div>
                <div class="span6 offset1">
                    <ul>
                        <li><strong>Plastering</strong></li>
                        <li><strong>Kitchen & Bathroom Refits</strong></li>
                        <li><strong>Tiling</strong></li>
                        <li><strong>Fencing</strong></li>
                        <li><strong>Fascias</strong></li>
                        <li><strong>Garages & Carports</strong></li>
                        <li><strong>Guttering</strong></li>
                    </ul>
                </div>  
            </div> 
   </body>

4

1 回答 1

0

堆叠是指文本重叠吗？如果是这种情况，您可以使用媒体查询来随着屏幕尺寸的变化而改变排版的尺寸。

请参阅下面的小提琴并调整右下窗格的大小（缩小）以查看字体大小的变化。

示例代码：

@media only screen and (min-width: 1100px) {
    body { font-size:120%;}
    .wrap {max-width:770px;}
}  

@media only screen and (max-width: 800px) {
    body { font-size:100%;}
}   

@media only screen and (max-width: 400px) {
    body { font-size:75%;}
}

小提琴。

于 2013-02-04T00:27:57.930 回答