-2

私はそれが純粋なセマンティックな方法であることを知っています

<form action="" method="">
        <fieldset>
          <legend>Contact Form</legend>
              <label for="name">Name</label>
              <input name="name" id="name" size="20" />
           </fieldset> 
<form>

しかし、デザインの目的によっては、必要なスタイルを取得するだけでは不十分な場合があります。だから私の質問は、この純粋に意味論的な方法以外です

フォームは順序付けられたフィールドのグループであり、1つずつ入力するため、このコードもセマンティックです（純粋なセマンティックメソッドの後）

ol {
  list-style: none; 
  padding-left: 0;
  }


<form action="" method="">
    <fieldset>
      <legend>Contact Form</legend>

      <ol>
        <li>
          <label for="name">Name</label>
          <input name="name" id="name" size="20" />
       </li> 

       <li>
        <label for="email">Email</label>
        <input name="email" id="email" size="20" />
       </li>

      <li>
        <label for=" Choices"> Choices (radio)</label>
          <input type="radio" name=" Choice" /> Choice 1
          <input type="radio" name=" Choice" /> Choice 2
          <input type="radio" name=" Choice" /> Choice 3
      </li>

      <li>    
      <label for=" Choices3"> Choices (checkbox)</label> 
        <input type="checkbox" name=" Choice3" /> Choice 1
        <input type="checkbox" name=" Choice3" /> Choice 2
        <input type="checkbox" name=" Choice3" /> Choice 3
     </li>       

     <li>
      <label for="dropdown">Question</label>

        <select id="dropdown">
          <optgroup label="Group of Options">
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
          </optgroup>
        </select>
      </li>

      <li>  
      <label for="message">Message</label><br />
        <textarea name="message"rows="12" cols="36"></textarea>
      </li>

      <li><input type="submit" value="send it" /></li>

      </ol>

    </fieldset>
  </form>
4

3 に答える 3

1

フォーム フィールドが特定の順序で完了するように意図されている場合、はい、順序付けられたリストは、フォーム要素を分離するために意味的に意味があると言えます。

于 2010-01-25T20:34:27.160 に答える
0

定義リストを使用して、ラベル/入力が for と id だけでなく、定義のタイトル (ラベル) と定義の説明 (入力) を介して相互にリンクされるようにする必要があります。

そうすれば、必要に応じて適切なスタイルを設定したり、一部を非表示にしたりできます。

于 2010-01-26T10:44:09.460 に答える
0

CSS からより多くのレイアウト スタイル フックを許可するために追加の要素を追加したいが、それ自体にセマンティック コンテンツがない場合は、<div>(または<span>for inline) を使用します。それが彼らの目的です。

于 2010-01-25T20:54:02.653 に答える