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 ...

Get WordPress® All-in-One For Dummies® now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial