Murach’s PHP and MySQL (4th Edition)
Murach’s Modern JavaScript
Murach’s JavaScript and jQuery (4th Edition)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!
HTML and CSS (6th Edition)
This 6th edition of our best-selling HTML and CSS book presents the skills that a web developer needs today. To do that, it uses the proven instructional approach that made the first five editions so popular. In addition, it updates and streamlines the previous edition so it works better than ever.
College Instructors
Go to our instructor's site to learn more about this book and its instructor's materials.
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
- About this Book
- Table of Contents
- FREE Downloads
- Book FAQs
- Corrections
- Reviews
Who this book is for
This book is for anyone who wants to learn how to use HTML and CSS to create responsive web pages. This includes:
- Anyone who wants to build a website, even if they have no programming experience
- Web designers who want to use HTML and CSS to implement their designs
- JavaScript programmers who want to improve their HTML and CSS skills
- Server-side developers who want to improve their HTML and CSS skills
What this book does
This book gets you started with HTML and CSS as quickly as possible and then builds out your skills in a professional way. To do that, it’s divided into three sections.
Section 1: Get started fast
To get you started right, the eight chapters in this section are a crash course in using HTML and CSS to develop web pages at a professional level. This course works for beginners as well as experienced web developers. By the end of this section, you will be able to develop web pages using the same coding techniques used by today’s top professionals.
That means you’ll be using semantic HTML elements to define the structure of a page. You’ll be using the CSS box model and flexbox layout right from the beginning. And you’ll be using media queries to implement a responsive web design. That way, your web pages will work on devices with screen of all sizes, from mobile devices to desktop computers.
When you complete this section of the book, you’ll be able to develop web pages at a professional level. Then, you can skip to any other chapter to learn new skills whenever you need them.
Section 2: More skills as you need them
This section expands on section 1 by presenting additional HTML and CSS skills that you may need on the job. That includes:
- More skills for working with lists and links
- More skills for working with images, icons, fonts, and colors
- How to embed fonts so all browsers can access them
- When and how to use tables, including how to make tables responsive
- How to work with forms and built-in HTML validation
- How to add audio and video to web pages
- How to use grid layout to create complex page layouts that are difficult to achieve with flexbox layout
- How to use CSS for transitions, transforms, filters, and animation
- How to control CSS specificity
Section 3: Web design and deployment
This section expands your knowledge of web development beyond HTML and CSS. That includes:
- Today’s best practices for designing a user-centric website
- How to use GitHub to deploy a site on a web server that’s running in the cloud
- How to get a site indexed by the major search engines
What's new
When we updated this edition, we focused on what a web developer needs to know today. As a result, we cut obsolete material, rearranged some topics, and streamlined the book to make it easier than ever to learn HTML and CSS.
- We streamlined chapters 1 and 2 to help you get started more quickly.
- We modified chapter 6 so it shows how to use flexbox (not floats) for page layout. This is a better and more modern coding practice.
- We modified chapter 7 so it shows how to use CSS (not jQuery) to display navigation menus. This is a better and more modern coding practice.
- In chapter 8, we added coverage of container queries, one of the most important new features of CSS.
- We modified the website that’s presented throughout the book to use mobile-first design instead of desktop-first design since that’s a best practice for most modern websites.
- We thoroughly streamlined and reworked the chapter on HTML forms to focus on modern best practices.
- In chapter 15, we added some new CSS features including functional pseudo-class selectors and cascade layers.
- Chapter 17 now shows how to use GitHub to deploy a website to a web server that’s running on DigitalOcean’s cloud platform.
What's the same
Like the 5th edition, the 6th edition has been printed in full color. This makes the pages more engaging and attractive, and we think it makes many of the skills easier to grasp too.
In addition, the 6th edition still shows how to use the popular Visual Studio Code (VS Code) text editor. This helps you learn to develop web pages more quickly and with fewer coding errors.
7 reasons why you'll love this book
- It presents modern best practices for using HTML and CSS and doesn’t waste your time by explaining old practices that are no longer recommended.
- It gets you started fast by presenting a complete subset of HTML and CSS that allows you to begin doing productive work as soon as possible.
- It teaches HTML and CSS in context so you can see how they work together to structure and format the pages of a website.
- It presents hundreds of examples that range from the simple to the complex. That way, you can quickly learn how a feature works and also see how it’s used in the real world.
- The exercises at the end of each chapter provide a way for you to gain valuable hands-on experience without extra busywork.
- It uses paired pages, with the essential syntax, guidelines, and examples on the right page and clear explanations on the left page. This helps you learn faster by reading less.
- The paired-pages format is ideal for reference when you need to refresh your memory about how to do something.
What software you need
A text editor
To develop web pages with HTML and CSS, you can use any text editor. However, we recommend using Visual Studio Code (VS Code) because it provides many features that can help you develop web pages more quickly and with fewer errors. This editor is available for free and runs on Windows and macOS.
A web browser
We recommend using the Chrome browser to do the primary testing for a web page. That’s because Chrome provides excellent developer tools that you can use to debug your web pages. This web browser is available for free and runs on Windows and macOS.
Related books
Modern JavaScript
If you want to learn how to add client-side functionality to your web pages, our Modern JavaScript book shows how to use pure JavaScript to do that. To make learning as fast and easy as possible, this book skips confusing old features and jumps straight to the best practices of modern JavaScript.
JavaScript and jQuery
If you need to learn jQuery, we recommend our JavaScript and jQuery book. This book is similar to Modern JavaScript in many ways, but it integrates coverage of jQuery, an influential JavaScript library that has been around since 2006 and is still used extensively in millions of websites.
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 Get started fast
Chapter 1 Introduction to web development
How web apps work
The components of a web app
The HTML for a web page
The CSS for a web page
A short history of the HTML and CSS standards
How web pages are processed
Four 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 HTML comments
The CSS syntax
How to code style rules
How to code basic selectors
How to code CSS comments
How to use VS Code
How to work with folders
How to work with files
How to edit an HTML file
How to edit a CSS file
How to use two VS Code extensions
How to install an extension
How to find syntax errors
How 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
How to validate HTML
How to validate CSS
Chapter 3 How to use HTML to structure a web page
How to code the head section
How to include metadata
How to set a title and a favicon
How to structure the body section
How to code headings and paragraphs
How to code the structural elements
When and how to use div elements
More skills for presenting text
How to code inline elements
How to code character entities and special types of 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 displayed in a browser
The HTML
Chapter 4 How to use CSS to format a web page
An introduction to CSS
How to provide the styles for a web page
How to use the basic selectors
How to specify measurements
How to specify colors
How to work with text
How to set the font family and font size
How to style and format fonts
How to indent, align, and decorate text
How to float an image
How to use other selectors
How to code relational selectors
How to code combination selectors
How to code attribute selectors
How to code pseudo-class selectors
How to code pseudo-element selectors
How the cascade rules work
How to organize your CSS
How to create and use custom properties
How to nest CSS
A formatted web page
The page displayed in a browser
The HTML
The CSS
How to use Developer Tools to inspect styles
Chapter 5 How to use the CSS box model
An introduction to the box model
How the box model works
A web page that shows how the box model works
How to size and space elements
How to set widths and heights
How to set margins
How to set padding
How to work with box sizing
How to use a reset selector
A web page that uses sizing and spacing
How to set borders and backgrounds
How to set borders
How to add rounded corners and shadows
How to set background colors and images
How to set background gradients
A web page that uses borders and backgrounds
Chapter 6 How to use flexbox for page layout
How to get started with flexbox
Flexbox layout concepts
How to create your first flexible box
How to create page layouts
How to create a 1-column layout
How to create a 2-column layout
How to create a 3-column layout
How to change the order of flex items
How to allocate space to flex items
A web page that uses a 2-column layout
How to implement a fluid design
How to control the viewport
How to use units of measure based on the viewport
How to size fonts relative to the viewport
How to scale images
A fluid web page
Chapter 7 How to use flexbox with navigation menus
Basic skills for navigation menus
How to display a navigation menu
How to style the links in a navigation menu
How to wrap menu items
How to align menu items along the main axis
How to align menu items along the cross axis
A web page with a navigation menu
How to create a 2-tier navigation menu
How to position an element
An example that uses positioning
How to create a submenu
Useful symbols for working with menus
A web page with a 2-tier navigation menu
Chapter 8 How to use media queries for responsive web design
Introduction to responsive web design
The components of a responsive web design
How to test a responsive design
How to work with media queries
How to code media queries
How to determine the breakpoints for media queries
A responsive web page
How to create a responsive navigation menu
How to create a menu button
A responsive navigation menu
A 2-tier responsive navigation menu
How to work with container queries
How to define a container
How to code a container query
A web page with a container query
Section 2 More HTML and CSS skills
Chapter 9 How to work with lists and links
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 a list
How to change the numbering system for a 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 tab
How to create and link to placeholders
How to link to a media file
How to create email and phone links
Chapter 10 How to work with images, icons, fonts, and colors
How to work with images
Types of images for the web
How to align an image vertically
How to add an image to a figure
How to change an image based on viewport size
How to use Scalable Vector Graphics
How to get and edit images
How to get images
When to use an image editor
How to work with icons
How to work with Font Awesome icons
How to work with favicons
How to work with fonts
How to embed fonts in a web page
How to use fonts from Google and Adobe
How to work with colors
How to use functions to specify colors
How to use relative colors
How to work with light and dark color schemes
Chapter 11 How to work with tables
Basic HTML skills for defining tables
An introduction to tables
How to define a table
How to add a header and footer
Basic CSS skills for formatting tables
How to format a table
How to use structural pseudo-classes to format a table
More skills for working with tables
How to add a table to a figure
How to merge cells in a column or row
How to make a table accessible
How to make a table responsive
Chapter 12 How to work with forms
How to get started with forms
How to define a form
How to format a form
How to get started with controls
How to use labels and text fields
How to use text areas
How to use radio buttons and check boxes
How to group controls
How to use drop-down lists
How to use list boxes
How to define buttons
How to format buttons
Other skills for working with forms and controls
How to set the tab order and assign access keys
How to use the number, email, url, and tel controls
How to use the date and time controls
How to use the file upload control
How to use HTML for data validation
The HTML attributes and CSS selectors
How to use regular expressions
A web page with a form
The web page
The HTML for the form
The CSS for the form
Chapter 13 How to add audio and video
An introduction to media on the web
Common media types for audio and video
How to convert from one media type to another
How to add audio and video
How to add audio
How to add video
How to provide alternate source files
Chapter 14 How to use grid layout
How to get started with grid layout
An introduction to grid layout
How to create a 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 grid areas
How to use numbered lines
How to use named lines
How to use template areas
How to use the 12-column grid
A web page that uses grid layout
The web page
The HTML for the structural elements
The mobile-first CSS for small screens
The media queries for larger screens
Common page layouts that use grid
The headline and gallery layout
The fixed sidebar layout
The advanced grid layout
How to debug the layout for a page
Chapter 15 More CSS skills
How to use transitions and transforms
How to code transitions
How to create an accordion using transitions
How to code 2D transforms
A gallery of images with 2D transforms
How to use animations and filters
How to code simple animations
How to set the keyframes for a slide show
How to use filters
Ten filter functions applied to the same image
Four more CSS skills
How to add shadows to text
How to work with user preferences
How to use functional pseudo-class selectors
How to work with logical properties
How to work with specificity
How specificity is calculated
How to use classes
How to use the :where() pseudo-class
How to use cascade layers
Section 3 Web design and deployment
Chapter 16 Users, usability, and web design
Users and usability
An introduction to usability
The current conventions for usability
Web design guidelines
Use mobile-first design
Use the home page to sell the site
Let users know where they are
Make the best use of web page space
Divide long pages into shorter chunks
Know the principles of graphic design
Write for the web
Chapter 17 How to deploy a website
How to deploy a website for testing
How to set up a GitHub account
How to install the GitHub Desktop app
How to create a GitHub repository
How to add files to a repository
How to set up a DigitalOcean account
How to deploy a website
How to test a deployed website
How to make changes to a deployed website
More skills for deploying a 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
Appendix
Appendix A How to set up your computer for this book
How to download the files for this book
How to install Visual Studio Code
How to install Chrome and other browsers
Book examples and exercises
This download includes the HTML and CSS files for:
- The complete web pages presented in this book
- The short examples presented in this book
- The starting points for the exercises at the end of each chapter
- The solutions to those exercises
Sample PDFs
Not sure whether this is the book for you? Download a free PDF and see for yourself how easy learning HTML and CSS can be.
Appendix A: How to set up your computer for this book
This appendix shows how to set up your computer for this book, including instructions for installing VS Code and the Chrome browser. When you’re done, you’ll be able to work through the examples and exercises presented in this book.
Download Now
Chapter 2: How to code, test, and validate a web page
This chapter shows how to create and edit the HTML and CSS files that define a web page. Then, it shows how to test those files to make sure they work correctly and how to validate them to make sure they conform to the latest HTML and CSS standards.
Download Now
On this page, we’ll be posting answers to the frequently asked questions (FAQs) for this book here. So, if you have any questions, please send them to us by email. Thanks!
There are no book corrections that we know of at this time. But if you find any, please send them to us by email, so we can post the corrections here. Thanks!