3

私は HTML5 フォームに取り組んでおり、いくつかの入力要素とそのラベルをフロートしたいと考えています。これが最善の方法ですか？

<form>
    <fieldset class="float_left">
        <label for="login">Login ID #</label>
        <input type="text" name="login" id="login">
    </fieldset>
    <fieldset class="float_right">
        <label for="password">Password</label>
        <input type="password" name="password" id="password">
    </fieldset>
    <span class="forgot_login float_left"><a href="#">Forgot your login information?</a></span>
    <input type="submit" value="LOG IN" class="form_button float_right">
</form>

人々がそれらを div やリストなどでラップしているのを見ました。ベスト プラクティスに従いたいと思います。スタイルを設定する予定がない場合でも、すべてのラベルと入力要素をフィールドセットでラップする必要がありますか? 元：

<form>
    <fieldset>
        <label for="name">Full Name:</label>
        <input type="text" name="name" id="name" placeholder="First Name" class="float_left">
    </fieldset>
    <fieldset>
        <label for="email">Email:</label>
        <input type="email" name="email" id="email" placeholder="Ex: johndoe@gmail.com" class="full_input">
    </fieldset>
    <fieldset>
        <textarea rows="3" name="message" id="message" placeholder="1000 Character or less" class="full_input"></textarea>
    </fieldset>
    <input type="submit" value="SEND" class="form_button float_right">
</form>

ありがとう。

4

3 に答える 3

0

fieldsetラベルとコントロールを組み合わせて使用​​することは非論理的ですが、形式的には有効です。 a はフィールドのセットfieldsetであると想定されています。

それ以外は、問題は主に意見と議論の問題です。HTML5 は多かれ少なかれpこのようなペアを支持しますが、デフォルトでは空の行が発生するためdiv、より合理的な選択です。tableラベル/コントロールのペアごとに 1 つの行を持つ要素を使用する正当な理由もあります。

于 2013-09-30T18:28:20.117 に答える
0

a を使用する予定がない限り、fieldset legendわざわざfieldsets を使用することはありません。ブートストラップ フォームも開始するのに適した方法ですhttp://getbootstrap.com/css/#formsただし、最善の方法はありません。

ラッパーを使用している人をよく見かけますdiv。これは、よりきれいな行を作成するのに役立つためです。つまり、ラッパー内のすべての要素ではなくラッパーにパディングを適用したり、親内のすべての要素をフローティングさせたり、下部に clear-fix 要素を適用して正しくラップしたりできます。または単に親もフロートします。

于 2013-09-30T18:31:01.357 に答える