top of page

08.15.2018: One Lesson of Coding

Today's soundtrack is William Fitzsimmons: Pittsburgh, a beautifully melancholic and strangely nostalgic album.

This afternoon, the Randomizer has decreed that I shall learn one lesson on freeCodeCamp. Today, I'll be learning how to use HTML to make checkboxes. Like radio boxes, checkboxes are a form that allows a site to receive user inputs; however, checkboxes allow for more than one selection at a time.

To allow for accessibility features, we start a checkbox by labeling it, then we mark its input ID with the label. To associate all of the checkboxes with the same form, all of the checkboxes should have the same name.

<label for "checkbox1"><input id="checkbox1" type="checkbox" name="form_1">First Choice</label>

<label for "checkbox2"><input id="checkbox2" type="checkbox" name="form_1">Second Choice</label>

If we want to have one or more of the boxes ticked by default, we just add the word "checked" after its name.

<label for "checkbox1"><input id="checkbox1" type="checkbox" name="form_1" checked>First Choice</label>

The "div" element, "probably the most commonly used HTML element of all" (citation), is a way to group elements. It's a kind of container that we can use so that any CSS style elements that we apply can be applied to whole sections at a time.

<div>[checkboxes, paragraphs, radio buttons, etc]</div>

For browser compatibility, we need to specify what version of HTML we are using. HTML5 is labeled as "HTML"; any other version (e.g. HMTL 3.2) will be labeled with their version number. So at the top of the page, we start with the HTML version number, then we start the HTML tag; at the end, we close the HTML tag.

<!DOCTYPE html><html> [page code] </html>

That's it for today! In the next lesson, I'll be learning about making a website head and body.

#WilliamFitzsimmons #FreeCodeCamp

bottom of page