Basic HTML and CSS Markup for WordPress Themes - dummies

Basic HTML and CSS Markup for WordPress Themes

By Lisa Sabin-Wilson

Part of WordPress Web Design For Dummies Cheat Sheet

When you work with WordPress themes to create web designs, you use basic HTML, combined with CSS styling, to accomplish the formatting and styling you desire for your website. Here’s a rundown of some basic HTML and CSS markup.

Name Description HTML Markup Example CSS Example
Indicates the header portion of a web page that contains
invisible, but vital, information about the page, such as the title
and keywords.
<title>My Web Site</title>
Defines the content area of your web page that’s visible in
your visitor’s browser window.
<p>This is my content</p>
body {background:
white; color:black}
<a href=”..”>
Inserts a hyperlink for either a word or an image. <a href=””>Google
a {color:blue}
<img src=”..”> Inserts an image in a web page. <img src=
jpg” />
img {padding 4px;
border: 1px solid
Defines groupings of text in paragraphs. <p>This text is treated as a paragraph</p> p {margin: 1.2em;
line-height: 1.2em;
color: red}
Defines a first-level heading, usually a title or menu heading.
You can also use h2, h3, h4, h5, and h6.
<h1>This is a title</h1> h1 {font-size:
18px; color: blue; margin: 10px 0;}