Untitled

<!DOCTYPE html>
<html>
    <head>
        <title>
            Class 1 Lab
        </title>
    </head>
    <body>
        <h1> Class 1 Lab </h1>
            <style>
                li{
                    color: green;
                    background-color: aquamarine;
                }
            </style>
        <p> My, what a pretty paragraph you are! </p>

        <script>
            var userName = prompt('What\'s your name?');
                console.log('User Name: ' + userName);

            var favColor = prompt(userName + 'What is your favorite color?');
                console.log(userName + 'favorite color: ' + favColor)
            var favCity = prompt(userName + 'What is your favorite city?')
                console.log(UserName + 'favorite city: ' + favCity)

            var favFood = prompt(userName + 'What is your favorite food?')
                console.log(UserName + 'favorite food: ' + favFood)
            alert('Welcome, ' + userName +
                '. It is so nice to hear that you like the color ' + favColor +
                '. I wish I could visit ' + favCity +'and eat' + favFood '!');
        </script>

        <p style="background-color: aquamarine";
            style="color: burlywood">
            What's your name?
        </p>
        <p style="background-color: chartreuse";
            style="color: crimson">
            What is your favorite color?
        </p>
        <p style="background-color: darkolivegreen";
            style="color: deeppink">
            What is your favorite city?
        </p>
        <p style="background-color: gold";
            style="color: indianred">
            What is your favorite food?
        </p>

        <footer>
            I'm the Footer!
        </footer>

    </body>
</html>