---
# System prepended metadata

title: Untitled

---

```
<_tagname_ style="_property_:_value;_">
```


**index.html**
```htmlembedded=
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>App Academy HTML/CSS Assessment</title>
  <link href="site.css" rel="stylesheet">
</head>

<body>
  <form action="/pets" method="post">
    <fieldset>

      <div>

        <label for="name">Name</label>
        <input type="text" id="name" name="pet_name">

      </div>

      <div id="nog">

        <label for="type">Type</label>
        <select id="type" name="pet_type">
          <option value="Cat">Cat</option>
          <option value="Dog">Dog</option>
          <option value="Hamster">Hamster</option>
          <option value="Other">Other</option>
          <option value="Zebra">Zebra</option>

        </select>

      </div>

      <div>

        <label for="bio">Biography</label>
        <textarea id="bio" name="pet_bio"></textarea>
      </div>

      <div>

        <label for="owner-email">Owner's Email</label>
        <input type="email" id="owner-email" name="pet_owner_email">

      </div>

      <div>
        <button type="submit" id="new-pet-submit-button">Create New Pet</button>
      </div>

      <div>
        <button type="reset">Reset</button>
      </div>

    </fieldset>
  </form>
</body>

</html>



```

```css=
/* site.css */

#nog {
  color:"red";
  
}

```

CSS Selectors

TagNames
> - body
> - div
> - button
> - form
> - option
> 
> *<button*>
>   
> </button>
> 

body {

}


ID
```html  
<div id="cock">
```

CSS
```css=
#cock {
  
}
```

Classes
```htmlembedded=
<div class="redbox">
  Hello I am Red
</div>
<div class="redbox">
  Still Red Bro
</div>
<div class="greenbox">
  I should be green
</div>
<div class="greenbox">
  Green for money bitch
</div>
<input class="greenbox">

```
CSS
```css=
div.redbox {
  color:"red"
}
div.greenbox {
  color:"green"
}

.greenbox {
  color:"fag"
}
```