0

私は最新バージョンのBootstrapを使用してWebサイトを構築していますが、いくつかの小さな不満を除けば、ほとんどうまくいっています。

主要なものは私のリストです。768px幅まで正常に機能する2つのリストがあります。その後、インラインで表示するための十分なスペースがある場合でもスタックします。

それは私が分類したいだけの迷惑な小さなことです。

私のリストのコード：

<!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 に答える