Make-up of a website
Let’s take a ride into the world of cosmetics and web development.
HTML (Hyperlink Text Markup Language) is one of two essential building blocks of any website. HTML is used to describe the content of the website you are building. It uses “tags” to build websites. A tag is a keyword that enables your browser to format content of your website. You can add attributes to the tag to customize your content.
The components of our application will consist of 5 unique tags(<body>,<form>,<label>,<input>,<br>). We have two labels to display instructions and output and another to display the user input. The input tag will take different inputs from the user and processes the data depending on the “type” attribute.
Within the realm of cosmetics, the HTML of our face consists of <nose>,<eyes>, <skin>, etc.
Within our application the function showInput() takes the value from the input field whose “id” was “user_input” and displays the data in the field with the id “display”
Now we have the basic parts of the face and functionality set let’s crack open our make-up bag.
CSS is what we use to make everything look nice. In our application, we decided to put on a little eyeliner and make some font bold by using the “class” attribute.
The CSS for our face would consist of .eyeshadow, .lip-stick, and .blush. We can set the colors within our CSS file and have our HTML display the colors.
CSS is ultimately the palette we use to make our website go from good to great. We can always go without CSS but everyone always asks why your website looks so tired.
Our application was the start of our journey into being a make-up guru. It may not look like much now but eventually we can make websites with the sharpest of wingtips.
Heres a demo for the application that was just built: https://repl.it/IqxR/0