如何使用ID属性来设置css中的元素样式？

Question

下面的代码需要表单元素中的属性id，但我无法弄清楚它是什么意思。有什么建议吗？

// i.stack.imgur.com/pT4GE.png

 #cat-photo-form
 {
  background-color: green;


}

<form

action = "/submit-cat-photo" id ="cat-photo-form">
  <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
  <label><input type="checkbox" name="personality" checked> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Energetic</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>

</form>

Answer 1

id和class是您在元素中包含的属性，以便在css中操作它们。
id在当前的html元素中必须是唯一的。
但是不止一个html元素可以具有相同的class。    至于你的例子，你应该在表格中id cat-photo-form.你不需要你内在的第二个id cat-form-element。像这样：

<style>
     #cat-photo-form
     {
      background-color: green;
    }
</style>
    <form action = "/submit-cat-photo" id ="cat-photo-form">
      <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
      <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
      <label><input type="checkbox" name="personality" checked> Loving</label>
      <label><input type="checkbox" name="personality"> Lazy</label>
      <label><input type="checkbox" name="personality"> Energetic</label>
      <input type="text" placeholder="cat photo URL" required>
      <button type="submit">Submit</button>

    </form>