Understanding Basic HTML Techniques
HTML can help you customize and organize your theme. To understand how HTML and CSS work together, think of it this way: If a Web site were a building, HTML is the structure (the studs and foundation) and CSS is the paint.
HTML contains the elements that CSS provides the styles for. All you have to do to apply a CSS style is use the right HTML element. Here is a very basic block of HTML that we can break down for this example:
<body> <div id="content"> <h1>Headline Goes Here</h1> <p>This is a sample sentence of body text. <blockquote>The journey of a thousand miles starts with the first step.</blockquote> I'm going to continue on this sentence and end it here. </p> <p>Click <a href="http://corymiller.com">here</a> to visit my website.</p> </div> </body>
All HTML elements must have opening and closing tags. Opening tags are contained in less-than (<) and greater-than (>) symbols. Closing tags are the same, except they are preceded by a forward-slash (/).
For example:
<h1>Headline Goes Here</h1>
Note that the HTML elements must be properly nested. In line four of the example above, a paragraph tag is opened (<p>). Later in that line, a block quote is opened (<blockquote>) and nesting inside the paragraph tag. When editing this line, you could not end the paragraph (</p>) before you ended the block quote (</blockquote>). Nested elements must close before the elements they are nested within close.
Finally, proper tabbing, or indenting, is important when writing HTML, mainly for readability so you can quickly scan through code to find what you're looking for. A good rule is that if you didn't close a tag in the line above, indent one tab over. This allows you to see where each element begins and ends. It can also be very helpful when diagnosing problems.
For more in-depth tutorials on HTML, see w3schools.com's HTML section at http://www.w3schools.com/html/default.asp.