1

ブラウザ ウィンドウのサイズを変更しても画像サイズが変わらないようにしたいのですが、すべての div コンテンツをカバーする必要があります。 .scollbar があれば問題ありません..しかし、それでも解決策を見つけることができません..plz help..

ここに私のコードがあります...

<style>
div{
 background-width:100%; 
 background-image: url('back5.jpg');
 background-id:back5;
 background-overflow-x:scroll;
}

</style>

</head>

<body style="margin:0px;overflow-x:scroll">

    <div>

    <img src="logo.gif">





    <label  style="type=text/css;position:absolute;left:600px;top:18px"/>

            <font size="5" style="color:#ffffff">E-mail:</font>

    </label>

    <label  style="type=text/css;float:right;position:absolute;left:600px;top:48px"/>

            <font size="5" style="color:#ffffff">Password:</font>

    </label>

    <Input type="text" name="_email" id="e_mail"  style= " type=text/css;-webkit-border-radius: 7px;
                                                          -moz-border-radius: 7px; border-radius: 7px;
                                                           background-color:#D8D8D8;
                                                           float:center;position:absolute;
                                                           left:720px;top:18px;
                                                           width:400px; height:25px"/>

    <Input type="text" name="_password" id="pass_word"  style="type=text/css;-webkit-border-radius: 7px; -moz-border-radius: 7px;
                                                                border-radius: 7px; background-color:#D8D8D8;
                                                                float:center;position:absolute;
                                                                left:720px ;top:48px; width:400px;
                                                                height:25px"/>

    <input type="submit" value="LogIn" style="type=text/css; float:center;position:absolute;
                                             left:870px ;width:600px; top:80px; width:60px;
                                             height:25px"/> 

    </div>



</body>

4

2 に答える 2

2

私の理解が正しければ、background-size と呼ばれるよく知られた CSS3 プロパティを試すことができます。

background-size: 100%;

これは最新のブラウザでのみ機能します。詳細については、https ://developer.mozilla.org/en-US/docs/CSS/background-size をご覧ください。

于 2013-04-16T08:16:32.543 に答える
1

画像にブートストラップレスポンシブクラスを使用できます。

ブートストラップを取得し、bootstrap.css をコードに含めます。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

その後、使用できます

<img src="..." class="img-responsive" alt="Responsive image">
于 2014-12-03T05:51:57.073 に答える