0

ユーザーがユーザー名とパスワードを入力するための1つのボタンで2つの入力が必要です。このcssコードを使用して、すべての画面サイズで正しく表示されるようにWebサイトの入力タグを制御しています。

.controller {
 width: 98%;
 margin: 0;
 padding: 7px 5px 4px;
 color: #555;
 font-size: 18px;
 font-family: inherit;
 border-style: solid;
 border-width: 0 1px 1px 0;
    }

ユーザーのこれら2つの入力の下にあるデータベースから取得される動的テキストが必要です。私の問題は、テキストが長い場合、入力の下に正しく表示されず、画面に収まらないように影響を与えることです。テキストが5〜10語しかない限り、問題はありません。

これが入力用のhtmlファイルです

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
    <form method="post" action="answer">
                <ul>
                    <li>
                        Login Name:<input type="text" name="id" class="controller"></input>
                    </li>
                    <li>
                        Password:<input type="password" name="pass" class="controller"></input>
                    </li>
                    <li>
                        <input type="submit" value="Login"></input>
                    </li>
                </ul>
    </form>     
</body>

これがCSSコードです

 .controller {
 width: 98%;
 margin: 0;
 padding: 7px 5px 4px;
 color: #400;
 font-size: 18px;
 font-family: inherit;
 border-style: solid;
 border-width: 0 1px 1px 0;
    }

誰かが私がしなければならないことを私にアドバイスするか、問題を制御するためのcssコードを与えることができますか？

ご回答ありがとうございます。長い質問をお詫び申し上げます。

4

1 に答える 1

2

だから、これがあなたのやりたいことだと思います。フォームの後、

<div id="response">
    <p> Some Long Block Of Text That Will Wrap Around This Div </p>
</div>

次に、CSSで次のようなことが起こります。

#response
{
    width: 75px; /*desired width*/
    margin-top: 25px; /*distance from the form above*/
}
#response p
{
    /*anything you want to do to that specific <p> */
}

動的テキストをどのように取得しているかはわかりませんが、情報を取得answerしてhtmlに配置するのはスクリプトだと思います。その情報をその中に配置するだけ<p>です#response

于 2012-06-23T15:13:43.390 に答える