Man, this was an awful weekend. New medical issues decided to pop up (my feet decided to join the party and become numb like my arms). On the plus side, I did get to see the new lego movie, which was fucking awesome.
HTML blocks and layout
I actually accidentally already learned about <span> and <div> earlier, because I had seen span a million times and then had to use it for styling outlines, but yolo we’ll cover it again. It turns out HTML elements can be one of two things – block level elements, or inline elements.
Block level – Typically start and end with a new line when displayed in a browser. Examples include <p>, <h1>, and <div>
Inline – Typically displayed without starting a new line. Examples include <b>, <td>, <a> and <span>
<div> is a block level element that can be used as a container for grouping other HTML elements. Because it is a block level element, the browser will display a line before and after it. It’s mainly used with CSS to style attributes to large blocks of content.
<div class=“firstlist”>
<h1>What’s good in the hood</h1>
<p>This whole thing will be styled</p>
</div>
Now <span>, however, is a inline element, meaning that there’s no line displayed before and after it. It is used as a container for text, to style parts of text.
<p> This is a good example of a <span id=“super”>super enthusiastic</span> part of my sentence </p>
In the examples above, you can see I linked them to id’s and classes, which I’d then use in my style sheet to style the sections their containing.