Add 'crash course in HTML elements'

[Ivoz]

I believe this would be very useful in between the structure and styling pages.

• List common elements and how to use them.
• Explain the basic rule of block and inline elements and how they are nested.
• Explain the id and class attributes, in preparation for the styling section.

[gsambrotta]

The idea is that learners have a html and css cheat sheet while working so they have all the definition and can try new stuff. There, they will find a good def of inline/block or id/class but I already wrote an something about it during the workshop. Do you think isn't enough or isn't clear?

[Ivoz]

The links to those were left blank, so I thought this might have been an idea left unimplemented so far.

Which cheat sheets are you referring to?

It wasn't at all clear to me that someone reading this tutorial was supposed to regularly refer to a cheat sheet.

I replaced those with links to the MDN which is basically a bible, in the index as I thought those would be the best references to look at (practically guaranteed to be up-to-date and correct)

[gsambrotta]

Thanks Ivoz for replaced the links. You are right, those links were meant to be extra material where people could learn more outside our workshop or reading something interesting.

About the cheat sheet, if you look at some part of the tutorial (for example at the end of the styled hello world second core page) i give to the people some times at the end of each explanation/exercise in order to try out what they just learnt but with different selectors or tag. Here is where they need a cheat sheet, we can't explain them all the selectors, properties and so on.

[Ivoz]

Do you have a link to the cheat sheet(s) you intend to use?

In case you do, feel free to add it/them above the reference section I created.

[gsambrotta]

I'm doing right now :) But i created a new section, just to have a better visualization and order page. Question: I can't figured out how to make link open in a new tab (target="_blank") in the index.html I would like to use for cheat sheet and for reference material as well. Do you have any idea how to do it?

[Ivoz]

You could try switching the markdown parser to kramdown and using its inline attributes feature, but you'll have to check if the code highlighting still works after.

Otherwise its possible to embed normal html in a markdown document as well.

[gsambrotta]

Done! Later i will do a PR. Thanks for the tip ;)