tags * It looks like this: *
Hello World
* The paragraph is a common html element and it is used to display text written between the opening and closing tags * _Headings_ are larger text elements and are used as titles *it's name is Whiskers
*) to force a line change * Don't abuse, please * If you want to add space between elements, space them apart with CSS * Sometimes wrapping the elements into a
we could color a single word
# Chrome Dev Tools When doing any kind of Front End development it is __essential__ to use the development tools of the browser. With the developer tools you can inspect your HTML code, check out which styles come from which source, see possible errors from the console etc.  We recommend using the Google Chrome browser. Other browsers have their own developer tools as well but we focus on Chrome here. When we do dynamic content with JavaScript we absolutely must use the developer tools. When using JS to dynamically generate content we can never be sure if we got the HTML code we wanted, __unless we check it. __ In JS development we most likely will also get a lot of error messages and console.log messages. Those will pop up in the Developer Tools' console. Developer tools are super helpful even when doing static web pages. # Accessing Dev Tools in Chrome  There are a few ways to access the dev tools. The easiest way is to just hit F12 Another hotkey is CTRL+SHIFT+I You can also open the tools from the chrome menu (three dots) -> More tools -> Developer tools You can also right click on any HTML element and select "Inspect". This method also scrolls the source code in the developer tools to said element, which is nice if we have an HTML file which is very long.   Elements can also be inspected with a cursor after clicking the arrow icon (see picture) in developer tools and hovering over the element of interest. This is extremely handy as the boundaries of elements are not always intuitive and this can make the aforementioned "right click + inspect" method tricky to use.  # Chrome Dev Tools  Basic features of the dev tools. There are others but these are enough for now. Source code Styles Console When you are developing and a web page or an application that runs on a browser and you want to check the result, it is a good practice to always: Check that the web page looks like you want it to look like Check that the source HTML code looks like you want it to look like You might have a page that looks all right but the code is not what you wanted. # User input There are all kinds of inputs Most common one is text input Inputs have a type and a name. The name is what the field will be called when the data is sent to a server. This is how this input looks: 