My Cart (0)

Customer Service 1-800-221-5528

Murach's HTML and CSS (5th Edition)

by Zak Ruvalcaba and Anne Boehm
18 chapters, 580 pages, 244 figures
Published December 2021
ISBN 978-1-943872-86-2
Print: $59.50
eBook: $54.50
Print + eBook: $72.00

This 5th edition of our best-selling book integrates all of the HTML and CSS skills that are needed on the job with the proven instructional approach that made the first 4 editions of this book so popular. And now, this new edition is in full color, making it easier and quicker than ever to master the subject as you see the effects of HTML and CSS coding changes right away.

College Instructors

Go to our instructor's site to learn more about this book and its instructor's materials.

I want to let you know how much I enjoy your HTML book, all the cool things I am learning that continually have me saying ‘wow’ as I go through the chapters.”

Dawn Kaczor, Business Owner, Massachusetts

  • About this Book
  • Table of Contents
  • FREE Downloads
  • Book FAQs
  • Corrections
  • Reviews

What this book does

This book gets you going with HTML and CSS as quickly as possible and then builds out your skills in a professional way. To make that manageable, it’s divided into four sections.

Section 1: The essential concepts and skills

This book starts with an 8-chapter course that shows you how to use HTML and CSS to build websites. This course works for beginners as well as experienced web designers. And the last chapter shows you how to use media queries and scalable images to implement Responsive Web Design (RWD) so your pages will look good and work right on any screen, from phone to tablet to desktop.

When you complete this section of the book, you’ll be able to develop web pages at a professional level. Then, you can go on to any other section or chapter to learn new skills whenever you need them.

Section 2: Responsive Web Design

The two chapters in this section show you how to use Flexible Box Layout and Grid Layout to provide RWD for web pages and portions of web pages. These are CSS modules that enhance what you learned in section 1, and every professional web developer needs to know how to use them.

Section 3: Other skills as you need them

This section expands on section 1 by presenting the other HTML and CSS skills that you’ll need on the job. That includes:

  • More on how to work with images, including how to provide images for varying viewport sizes and how to work with icons, image maps, and image rollovers
  • When and how to use tables, including how to make them responsive
  • How to work with forms and the HTML validation features
  • How to add audio and video to your pages
  • How to use custom fonts, a skill that will make the day for your graphics designers
  • How to use the CSS features for transitions, animations, transforms, and filters

Section 4: Web design, deployment, and JavaScript

Once you have a good grasp of how to develop web pages, you can better understand what you’ll do before and after you write the code. That’s where the 3 chapters in this section come in:

  • Chapter 16 shows how to make you websites more effective by focusing on users, usability, and the established guidelines for web design.
  • Chapter 17 not only shows how to deploy a site on an Internet server, but also shows how to get the site indexed by the major search engines.
  • Chapter 18 shows how to add JavaScript and jQuery features like image swaps and slide shows to web pages...without knowing how to code JavaScript and jQuery.

By the way, after you read chapter 18, you’ll probably want to learn how to write your own JavaScript and jQuery routines to customize your websites. So when you’re ready for that, you can get our JavaScript and jQuery book.

Who this book is for

This book is for anyone who wants to develop web pages at a thoroughly professional level. That includes:

  • budding web designers and developers
  • web developers who need to expand and enhance their skillsets
  • JavaScript programmers who need to know more about the HTML and CSS that they’re scripting
  • web developers who use Content Management Systems and discover that they desperately need to know what’s going on behind the scenes

What's new in this book

At long last, HTML and CSS have come of age, so there are no significant content additions in this edition of the book. Besides that, all modern browsers support all of the HTML and CSS features, so browser compatibility is no longer an issue that needs to be addressed.

That left us free to focus on simplifying and improving every chapter so you can learn faster and better than ever from this book. We’ve also printed the book in full color. That’s a change that’s been requested for many years...and we agree: color makes many of the skills easier to understand. It also makes this book an even better on-the-job reference.

The only significant content change is that the book now shows you how to use Visual Studio Code (VS Code) as your text editor. That’s the text editor that has become so popular for all types of program development, including web development with HTML, CSS, and JavaScript. And chapter 2 provides a tutorial that shows you how to use it for HTML and CSS.

Why you'll learn faster and better with this book

Like all our books, this one has features that you won’t find in competing books. That’s why we believe you’ll learn faster and better with our book than with any other. Here are a few of those features:

  • If you page through this book, you’ll see that all of the information on each topic is presented in “paired pages,” with the essential syntax, guidelines, and examples on the right page and the perspective and extra explanation on the left. This helps you learn faster by reading less...and it’s ideal for quick reference, too.
  • To show you how HTML and CSS work, this book presents the code for complete websites that range from the simple to the complex. We believe that studying the code for complete websites is critical to learning...and yet you won’t find applications like ours in other books.
  • This book also presents dozens of short examples that let you (1) master new skills in manageable bites and (2) look up information as you need it. And our paired pages make it much easier to find the example you need than it is with other books that embed the examples in the text.
  • At the end of each chapter, there are exercises that give you hands-on experience by letting you practice what you’ve learned. These exercises also encourage you to experiment and to apply what you’ve learned in new ways…just as you’ll have to do on the job.

What software you need

A text editor

Although you can use a text editor as simple as Notepad to code HTML and CSS, a text editor that includes syntax coloring, auto-completion, and error-marking will help you build web pages more quickly and with fewer errors. That in turn means that you will learn faster.

That’s why our book recommends VS Code as the text editor. This editor was developed by Microsoft; it’s available for free; it can be used for HTML and CSS (and JavaScript, too); and it runs on Windows, macOS, and Linux systems.

To help you get going with VS Code, the appendix in our book shows how to download and install it on Windows and macOS. And chapter 2 shows you how to use it.

Of course, if you already have a favorite editor or IDE, you can use that. But if you don’t have a favorite, VS Code is hard to beat.

The Chrome browser

To run and test web applications, you should use at least two browsers. Since Edge is always available with Windows and Safari with macOS, you already have one browser.

Then, for the second browser, you should install Chrome because it’s the most popular browser and because this book shows how to use some of its developer tools. That’s why the appendix in this book shows how to download and install Chrome.

The perfect companion book

If you combine this book with Murach’s JavaScript and jQuery, you’ll be on your way toward mastering client-side development. This companion book takes you from beginner to expert as it presents the JavaScript and jQuery skills that you need for building client-side applications. And unlike other books, it uses a tightly integrated approach that shows you how to use JavaScript for what it does best, and how to use jQuery for what it does best.

What people say about this book

“I just want to let you know how much I enjoy your HTML book, all the cool things I am learning that continually have me saying ‘wow’ as I go through the chapters.”
 - Dawn Kaczor, Business Owner, Massachusetts

"An excellent source for anybody, novice or professional, looking to get started with HTML and CSS. It is my go-to guide when I’m designing web pages."
 - Jamie McMahon, DreamInCode.net

“For me, the great thing about this book is the way it is laid out. Information is on the left page and the visual of what is being discussed is on the right page - genius!”
 - Posted at an online bookseller

“Entry-level options don't get any better.You'll have all the skills you need to create basic web pages by the end, including HTML structure, styling with CSS, mobile web design, as well as basic JavaScript and jQuery skills.”
 - Posted at an online bookseller

“What makes the book better than so many other technical books is how it uses a running example that becomes more complex, and weaves in lots of CSS along the way. It's been very helpful towards learning the fundamentals, and not merely being used as a cookbook.”
 - Posted at an online bookseller

“I was very impressed with how this book was structured and organized. Unlike other programming books, it was not boring at all and it was so well written that it was very easy to follow, understand, and most importantly, to LEARN from.”
 - Posted at an online bookseller

"This is not just a training book, but also something of a cookbook and reference guide. I can see it not spending much time on my bookshelf!"
 - David Bolton, news.dice.com

“In the typical Murach style, this book walks you through HTML in a clever step-by-step fashion, making it extremely easy to learn and remember. As an added benefit, the book teaches you best practices for making your web page easily accessible on the web, along with SEO every step of the way.”
 - Posted at an online bookseller

“It's the first time I bought a book and enjoyed every page of it. I've been doing web developing for a while. Never saw a book like this. A++++”
 - Posted at an online bookseller

View the table of contents for this book in a PDF: Table of Contents (PDF)

Click on any chapter title to display or hide its content.

Section 1 The essential concepts and skills

Chapter 1 Introduction to web development

How web applications work

The components of a web application

How static web pages are processed

How dynamic web pages are processed

How JavaScript fits into web development

An introduction to HTML and CSS

The HTML for a web page

The CSS for a web page

A short history of the HTML and CSS standards

Tools for web development

Text editors and IDEs

FTP clients

How to view a web page and its source code

How to view a web page

How to view the source code for a web page

Four critical web development issues

Responsive Web Design

Cross-browser compatibility

Web accessibility

Search engine optimization

Chapter 2 How to code, test, and validate a web page

The HTML syntax

The basic structure of an HTML document

How to code elements and tags

How to code attributes

How to code comments and whitespace

The CSS syntax

How to code CSS style rules and comments

How to code basic selectors

How to use VS Code to develop web pages

How to work with folders

How to work with files

How to edit an HTML file

How to use the HTMLHint extension to find HTML errors

How to edit a CSS file

How to use the Live Server extension to open an HTML file in a browser

How to test and debug a web page

How to test a web page

How to debug a web page

How to validate HTML and CSS files

How to validate an HTML file

How to validate a CSS file

Chapter 3 How to use HTML to structure a web page

How to code the head section

How to include metadata

How to code the title element and link to a favicon

How to present the contents of a web page

How to code the lang attribute

How to code headings and paragraphs

How to code the structural elements

When and how to use div elements

Other elements for presenting text

How to code the inline elements for text

How to use character entities and three block elements for text

How to code links, lists, and images

How to code URLs

How to code links

How to code lists

How to include images

A structured web page

The page layout

The HTML file

Chapter 4 How to use CSS to format the elements of a web page

An introduction to CSS

How to provide CSS styles for a web page

How to use the basic selectors to apply CSS to HTML elements

When and how to use the normalize style sheet for browser compatibility

How to specify measurements and colors

How to specify measurements

How to specify colors

How to use advanced techniques to specify colors

How to work with text

How to set the font family and font size

How to set the properties for styling and formatting fonts

How to add shadows to text

How to float an image so text flows around it

How to use other selectors to apply styles

How to code relational, combination, and attribute selectors

How to code pseudo-class and pseudo-element selectors

How the cascade rules work

The HTML and CSS for a web page

The page layout

The HTML file

The CSS file

How to use Developer Tools and custom properties

How to use Developer Tools to inspect the styles that have been applied

How to create and use custom properties

Chapter 5 How to use the CSS box model

An introduction to the box model

How the box model works

A web page that illustrates the box model

How to size and space elements

How to set widths and heights

How to set margins

How to set padding

A web page that illustrates sizing and spacing

The HTML for the web page

The CSS for the web page

A version of the CSS that uses a reset selector

How to set borders and backgrounds

How to set borders

How to add rounded corners and shadows to borders

How to set background colors and images

How to set background gradients

A web page that uses borders and backgrounds

The HTML for the web page

The CSS for the web page

Chapter 6 How to use CSS for page layout

How to develop 2- and 3-column page layouts

How to float and clear elements

How to use floating in a 2-column, fixed-width layout

How to use floating in a 2-column, fluid layout

How to use floating in a 3-column, fixed-width layout

A home page with a 2-column, fixed-width layout

The home page

The HTML for the home page

The CSS for the home page

A speaker page with a 2-column, fixed-width layout

The speaker page

The HTML for the speaker page

The CSS for the speaker page

How to create text columns

The properties for creating text columns

A 2-column web page with a 2-column article

How to position elements

Four ways to position an element

How to use absolute positioning

How to use fixed positioning

Chapter 7 How to work with lists, links, and navigation menus

How to code lists

How to code unordered lists

How to code ordered lists

How to code nested lists

How to code description lists

How to format lists

How to change the bullets for an unordered list

How to change the numbering system for an ordered list

How to change the alignment of list items

How to code links

How to link to another page

How to format links

How to use a link to open a new browser window or tab

How to create and link to placeholders

How to link to a media file

How to create email and phone links

How to create navigation menus

How to create a vertical navigation menu

How to create a horizontal navigation menu

How to create a 2-tier navigation menu

How to create a 3-tier navigation menu

The CSS for a 3-tier navigation menu

Chapter 8 How to use media queries for Responsive Web Design

Introduction to Responsive Web Design

The three components of a Responsive Web Design

How to test a responsive design

How to implement a fluid design

Fluid layouts vs. fixed layouts

How to convert fixed widths to fluid widths

How to use other units of measure with responsive design

How to size fonts

How to scale images

A web page with fluid design

The HTML for the web page

The CSS for the web page

How to use media queries

How to control the mobile viewport

How to code media queries

How to determine the breakpoints for media queries

How to build responsive menus with the SlickNav plugin

A web page with Responsive Web Design

The design of the web page

The CSS for the media queries

The CSS when using mobile-first coding

The CSS for the smallest viewports

The CSS for the media queries

Section 2 Responsive Web Design

Chapter 9 How to use Flexible Box Layout for Responsive Web Design

An introduction to Flexible Box Layout

The basic flexbox concepts

How to create your first flexible box

How to set flexbox properties

How to align flex items along the main axis

How to align flex items along the cross axis

How to wrap and align wrapped flex items

How to allocate space to flex items

How to change the order of flex items

A responsive web page that uses flexbox

The design of the web page

The HTML for the main structural elements

The CSS for larger screens

The CSS for smaller screens

Chapter 10 How to use Grid Layout for Responsive Web Design

Getting started with Grid Layout

An introduction to Grid Layout

How to create a basic grid

How to set the size of grid tracks

The properties for aligning grid items and tracks

A page layout that uses alignment

How to define the grid areas for elements

How to use numbered lines

How to use named lines

How to use template areas

How to use the 12-column grid concept

A responsive web page that uses grid layout

The design of the web page

The HTML for the structural elements

The CSS for the template areas

The media query for smaller screens

The CSS for the page with a 12-column grid

Common page layouts that use grid

The headline and gallery layout

The fixed sidebar layout

The advanced grid layout

Section 3 More HTML and CSS skills as you need them

Chapter 11 How to work with images, icons, and fonts

Basic skills for working with images

Types of images for the Web

How to include an image on a page

How to resize an image

How to align an image vertically

How to float an image

Other skills for working with images

How to use the HTML figure and figcaption elements

How to do image rollovers

How to create image maps

How to provide images for varying viewport sizes

How to use the img and picture elements

How to use Scalable Vector Graphics

How to get the images and icons that you need

When to use an image editor

How to get images

How to get and work with icons and favicons

How to work with fonts

How to embed fonts in a web page

How to use Google and Adobe Web Fonts

Chapter 12 How to work with tables

Basic HTML skills for coding tables

An introduction to tables

How to create a table

How to add a header and footer

Basic CSS skills for formatting tables

How to use CSS to format a table

How to use the CSS structural pseudo-classes for formatting tables

Other skills for working with tables

How to use the HTML figure and figcaption elements with tables

How to merge cells in a column or row

How to provide for accessibility

How to make a table responsive

Chapter 13 How to work with forms

How to use forms and controls

How to create a form

How to use buttons

How to use text fields and text areas

How to use radio buttons, check boxes, and labels

How to use drop-down lists and list boxes

How to use the number, email, url, and tel controls

How to use the date and time controls

Other skills for working with forms

How to align controls

How to group controls

How to set the tab order and assign access keys

How to use the HTML features for data validation

The HTML attributes and CSS selectors for data validation

How to use regular expressions for data validation

A web page with a form

The page layout

The HTML

The CSS

How to use other HTML controls

How to use the search control

How to use the file upload control

How to use the color, range, progress, and meter controls

How to use a data list and an output control

Chapter 14 How to add audio and video to a web page

An introduction to media on the web

Common media types for audio and video

How to convert a file from one media type to another

How to use the HTML audio and video elements

A web page with audio and video

The page layout

The HTML

Chapter 15 How to use CSS transitions, transforms, animations, and filters

How to use CSS transitions

How to code transitions 

How to create an accordion using transitions

How to use CSS transforms

How to code 2D transforms

A gallery of images with 2D transforms

How to use CSS animations

How to code simple animations

How to set the keyframes for a slide show

How to use CSS filters

How to code filters

The ten filter methods applied to the same image

Section 4 Web design, deployment, and JavaScript

Chapter 16 Users, usability, and web design

Users and usability

What web users want is usability

The current conventions for usability

Design guidelines

Use mobile-first design

Use the home page to sell the site

Let the users know where they are

Make the best use of web page space

Divide long pages into shorter chunks

Know the principles of graphics design

Write for the web

Chapter 17 How to deploy a website

How to transfer files to and from an Internet server

How to connect to a website on the Internet

How to upload and download files

How to test a web page that has been uploaded to the Internet server

How to start your own website

How to get a web host

How to get a domain name

How to get your website into search engines

How to set up, maintain, and improve a website

Chapter 18 How to use JavaScript to enhance your web pages

Introduction to JavaScript

How JavaScript works

Three ways to include JavaScript in a web page

How DOM scripting works

Methods and properties for DOM scripting

How JavaScript handles events

The Email List application in JavaScript

The HTML

The JavaScript

Introduction to jQuery

How to include jQuery in your web pages

How to code jQuery selectors, methods, and event methods

The Email List application in jQuery

The HTML

The jQuery

How to use JavaScript as a non-programmer

The Image Swap application

The Slide Show application

Three sources for tested JavaScript and jQuery

Appendix

Appendix A How to set up your computer for this book

How to install the source code for this book

How to install Visual Studio Code

How to install Chrome and other browsers

Sample chapter

Chapter 5: How to use the CSS box model 

To give you an idea of how well this book works, you can download this chapter and try it out. It shows you how to use the CSS box model to control the spacing above, below, and on the sides of elements like headings, text, and images.

This chapter also shows you how to use CSS to add borders or backgrounds to elements. That includes the CSS features that let you round the corners of borders, add shadows to borders, and provide gradients as backgrounds.

Chapter 5 PDF (867 Kb) Download Now

Book applications and exercises

This download includes:

  • The HTML and CSS code for all of the applications that are presented in the book
  • The starting source code for the exercises in the book
  • The solutions for the exercises in the book

Appendix A in the book shows how to install and use these files on Windows and macOS systems.

Zip file for any system (36Mb) Download Now

On this page, we’ll be posting answers to the questions that come up most often about this book. So if you have any questions that you haven’t found answered here at our site, please email us. Thanks!

There are no book corrections that we know of at this time. But if you find any, please email us, and we’ll post any corrections that affect the technical accuracy of the book here. Thank you!

There are no reviews for this product yet.

To leave a review, please log in to your account.     Log In Here

Our Ironclad Guarantee

You must be satisfied. Try our print books for 30 days or our eBooks for 14 days. If they aren't the best you've ever used, you can return the books or cancel the eBooks for a prompt refund. No questions asked!

Contact Murach Books

For orders and customer service:

1-800-221-5528

Weekdays, 8 to 4 Pacific Time

College Instructors

If you're a college instructor who would like to consider a book for a course, please visit our website for instructors to learn how to get a complimentary review copy and the full set of instructional materials.