0

現在、デザインを少し変更したい次のログインフォームを使用しています。

http://html-form-guide.com/php-form/php-login-form.html

「ログイン」をボックスの左側ではなく中央に配置したい:

また、fg_membersite.css (17 行目) でテキストサイズ、フォントなどを変更できることもわかりました。興味深いのは、Chrome では中央に表示され、Firefox では左側に表示されることです。私は新しい CSS ワーカーなので、この非互換性の問題をここで修正するのを手伝ってくれる人がいるかどうか尋ねたいと思いました。

Javascript ベースのものもたくさん含まれているので、ここにソース コードを投稿することが適切かどうかはわかりませんでした。とにかくソース全体を投稿する必要があるからです。

前もって感謝します！

編集：今はもっときれいです。ありがとう：

http://rapidhdd.com/images/4013242013-10-06_1842.png

4

2 に答える 2

0

これを中央のテキスト部分に使用します。

<form id='login' action='login.php' method='post' accept-charset='UTF-8'>
<fieldset >
<legend align="center">Login</legend>
<input type='hidden' name='submitted' id='submitted' value='1'/>

<label for='username' >UserName*:</label>
<input type='text' name='username' id='username'  maxlength="50" />

<label for='password' >Password*:</label>
<input type='password' name='password' id='password' maxlength="50" />

<input type='submit' name='Submit' value='Submit' />

</fieldset>
</form>

HTMLコードを変更したと思いますが、次のことに注意してください。<legend align="center">Login</legend>

整列="中央"

http://jsfiddle.net/4szBC/

編集：

align は廃止されたようですので、css を使用してこれを行うことができます。

legend {
    text-align: center;
}

css を HTML で正しく使用する場合は、<script>タグに追加して に配置し<head>ます。このような：

<script type="text/css">
    legend {
        text-align: center;
    }
</script>

http://jsfiddle.net/4szBC/1/

于 2013-10-06T14:42:29.360 に答える
0

送信ボタンにいくつかの CSS ルールを追加します。

input[type=submit] {
    display: inline-block;
    margin: 0 auto;
    padding: 10px 30px;
}
于 2013-10-06T14:43:47.267 に答える