Untitled

<html>

    /*(4)-start*/
    <head>
        <style>

            body{
                background-image: url("image.jpg")
                /*(5)-In simple terms, a GIF has more data than a JPG.*/
            }
        </style>
    </head>
    /*(4)-end*/

    <body>

        <!--(3)-start-->
        <img src="image.jpg" />
        <!--(3)-end-->

        <!--(2)-start-->
        <input type="text" name="sample_text" size="20">  <!--you can only type 20 characters in this input-->
        <input type="password" name="sample_password">  <!--replaces the characters with * or a dot-->

        <!--radios of same group must have identical name-->
        <!--when you select a radio button,
        it deselects the currently selected radio button,
        if there is any-->
        <input type="radio" name="radio_group" value="1" checked"> <!--this radio button is checked-->
        <input type="radio" name="radio_group" value="2">
        <input type="radio" name="radio_group" value="3">
        <input type="radio" name="radio_group" value="4">
        <input type="checkbox" name="is_checkbox" checked> <!--this checkbox is already checked-->
        <input type="button" id="submit_button"> <!--this is like a microphone, which does nothing until it's plugged in to a powered speaker (javascript)-->
        <button type="button"></button>
        <!--(2)-end-->
    </body>
</html>