Master HTML & CSS
Master HTML & CSS
$8.00
Minimum price
$8.00
Suggested price
Master HTML & CSS

Last updated on 2020-03-03

About the Book

This book will teach you two languages that the browsers are using to render a Web Page. HyperText Markup Language (HTML), which is used to structure the Web Page with visual elements, and CSS (Cascading StyleSheets), which is used to tell things about the look and feel of the content, like the font size and the color. It starts from the basics and takes you to an advanced level.

About the Author

Panos Matsinopoulos
Panos Matsinopoulos

I love developing programs, both for Web browsers and for mobile apps. I have been doing that for the last 25 years and I have developed numerous applications. My other love is teaching programming, how to design and develop programs. If you want to learn more about me, you can visit my LinkedIn profile.

Table of Contents

  • Credits To Photo on Cover Page
  • About and Copyright Notice
  • HTML & CSS
    • Chapter 1 - Introduction
      • Summary
      • Learning Goals
      • What is HTML
      • What is CSS
      • Tasks and Quizzes
    • Chapter 2 - Setup Development Environment
      • Summary
      • Learning Goals
      • Setup your development environment
      • We are using Linux
      • Linux Users - Ideal Environment
      • Windows Users - Let’s get a Linux
      • HTML & CSS Editor
      • Tasks
    • Chapter 3 - Hello World!
      • Summary
      • Learning Goals
      • Hello World Page
      • Write the HTML code
      • View your HTML page on your browser
      • Tasks
    • Chapter 4 - Minimum HTML Document
      • Summary
      • Learning Goals
      • Minimum HTML Document
      • One html tag
      • One head and one body like humans
      • Let’s fill in the <head>
      • The title of our page
      • Let’s fill in the <body>
      • Tasks and Quizzes
    • Chapter 5 - Heading Tags
      • Summary
      • Learning Goals
      • Heading Tags
      • Tasks
    • Chapter 6 - About White Space
      • Summary
      • Learning Goals
      • About White Space
      • Line break HTML tag <br>
      • White spaces between words
      • Tasks
    • Chapter 7 - HTML Entities
      • Summary
      • Learning Goals
      • HTML Entities
      • Some Common Ones
      • HTML reserved characters
      • Currencies
      • Special Alphabet Characters
      • Other Symbols
      • Full References
      • Tasks & Quizzes
    • Chapter 8 - Paragraphs, Horizontal Lines And Comments
      • Summary
      • Learning Goals
      • Paragraphs, Horizontal Lines and Comments
      • Paragraphs
      • Horizontal Lines
      • Comments
      • Tasks
    • Chapter 9 - HTML Lists
      • Summary
      • Learning Goals
      • Lists
      • Unordered Lists
      • Ordered Lists
      • Nested Lists
      • Tasks
    • Chapter 10 - HTML Tables
      • Summary
      • Learning Goals
      • Tables
      • Starting and closing tags
      • Rows of the table
      • Columns of the table
      • Table Head and Table Body
      • Head Cells
      • Cell spacing
      • Cell padding
      • Column Span
      • Aligning
      • Row span
      • Styling tables
      • Tables and Emails
      • Tasks & Quizzes
      • Quiz:
    • Chapter 11 - First Simple CSS Rules
      • Summary
      • Learning Goals
      • First Simple CSS Rules
      • Style Rules and CSS Language
      • Default style values
      • Set the color of the text - color
      • Set the text size - font-size
      • Set border - border
      • Set background / fill color - background-color
      • The <style> tag
      • The reference to the CSS file
      • Tasks
    • Chapter 12 - First Encounter With CSS Selectors
      • Summary
      • Learning Goals
      • First Encounter with CSS Selectors
      • Selecting by the HTML tag name
      • Specificity - Containing-Contained Relationships
      • Multiple selectors
      • Tasks
    • Chapter 13 - More Advanced CSS Selectors
      • Summary
      • Learning Goals
      • More Advanced CSS Selectors
      • id attribute
      • CSS Selecting elements by id
      • The class attribute
      • Combining class selection with tag name selection
      • Multiple classes on same element
      • Tasks
    • Chapter 14 - Talk About Color
      • Summary
      • Learning Goals
      • Let’s Talk about Color
      • Text Color and Background Color
      • Specifying the color value
      • RGB Color With Transparency
      • Tasks
    • Chapter 15 - Formatting Parts Of Text
      • Summary
      • Learning Goals
      • Formatting parts of text
      • span tag
      • HTML formatting tags
      • Closing note
      • Tasks
    • Chapter 16 - CSS Box Model
      • Summary
      • Learning Goals
      • CSS Box Model
      • Boundaries of Body
      • Visible Border Box
      • Padding Area
      • Margin Area
      • CSS Box Model again
      • Use Chrome Developer Tools
      • Width and Box Sizing
      • Line Height
      • Inherited and Non-Inherited values
      • Applying Rule To All Elements
      • Why body background-color covers the whole canvas?
      • Tasks
    • Chapter 17 - Block And Inline Elements
      • Summary
      • Learning Goals
      • Block and Inline HTML Elements
      • Block HTML Elements
      • Inline HTML Elements
      • Default Block Elements
      • Default Inline Elements
      • Setting width and height for inline elements
      • Closing Note
      • Tasks
    • Chapter 18 - Dividing Page To Sections Using Divs
      • Summary
      • Learning Goals
      • Dividing Page to Sections Using <div>
      • Step 1: Empty Page
      • Step 2: Let’s set the basic rules
      • Step 3: Dividing our page
      • Step 4 - Left Column
      • Step 5 - Middle Column
      • Step 6 - Right Column
      • Step 7 - Use float to position the elements.
      • Step 8 - Footer
      • Step 9 - Fixing footer problem with clear
      • Final Styling Touches
      • Tasks
    • Chapter 19 - HTML Links
      • Summary
      • Learning Goals
      • HTML Links
      • <a> tag
      • http:// or https://
      • Anything a link
      • Styling the Anchor Links
      • Style links as buttons
      • Side Note - CSS comments
      • Links within the same page - Bookmarks
      • Links to Other Pages within Same Site
      • Styling the links on navigation bar
      • Tasks
    • Chapter 20 - Deploying Our Work
      • Summary
      • Learning Goals
      • Deploying Our Work
      • Static Sites
      • Sites are hosted on Servers
      • Companies Offering Hosting
      • Netlify - Create an Account
      • Deploy our first Site
      • Deploying a Site with Stylesheets/CSS
      • Deploying to Netlify using the command line
      • Netlify Optimizes our CSS
      • Disable Optimization of your CSS content
      • Tasks
    • Chapter 21 - Images
      • Summary
      • Learning Goals
      • Images
      • Image Files
      • <img> tag
      • The src attribute
      • The alt and the title attributes
      • Image size
      • Images as Links
      • Text Around Images
      • Images and line height
      • Using images stored on our site
      • Tasks
    • Chapter 22 - Image Backgrounds
      • Summary
      • Learning Goals
      • Image Backgrounds
      • Image as a body background
      • Let’s Be More Accurate
      • How To Stop Propagation
      • Body Without Content is Not Displayed
      • Adding Content to Body
      • Make body High Enough
      • Remove Margin
      • Where is The Happy Dogs Text?
      • One Image to Cover Whole Page
      • Center Image
      • Cover The Whole Body
      • Adding Text On the Page
      • Make the Image Fixed
      • Use A Big Image
      • Background Images on Parts of Page
      • Bottom Margin Will Not Work
      • A Blank Div Will Do
      • Why Bottom Margin Didn’t Work?
      • Move Background to HTML instead
      • DRYing our Code
      • Background Size
      • Background Color
      • background shorthand property
      • Tasks
    • Chapter 23 - Element Positioning
      • Summary
      • Learning Goals
      • Element Positioning
      • Inline Elements
      • Block Elements
      • Float Property
      • Clear Property
      • Positioning Relative to Browser Window
      • Positioning Element Relative To Their Normal Position
      • Positioning Elements Relative To Other Element
      • Positioned Elements
      • z-index
      • Tasks
    • Chapter 24 - CSS Units
      • Summary
      • Learning Goals
      • CSS Units
      • Everything is pixels
      • Absolute Units
      • Default Font Size
      • Default Font Size and Absolute Units
      • Relative Units
      • Tasks
    • Chapter 25 - Collapsing Margins
      • Summary
      • Learning Goals
      • Collapsing Margins
      • What is collapsing margins?
      • Parents and Children
      • How can we preserve both parent and children margins?
      • How can we eliminate the collapsing vertical margins phenomenon?
      • Why do the vertical margins collapse?
      • Closing Suggestion
      • Tasks
    • Chapter 26 - Fonts and Typeface
      • Summary
      • Learning Goals
      • Fonts and Typeface
      • Font Families
      • General Families
      • Specifying Font Family with CSS
      • Default Font Families
      • Safe CSS Font Stacks
      • Make Sure Browser Is Using the Font We Want
      • Other Properties of the Fonts
      • Tasks
    • Chapter 27 - HTML Forms
      • Summary
      • Learning Goals
      • HTML Forms
      • input of type="text"
      • label
      • select
      • input of type=submit
      • form
      • Input elements’ ID
      • autofocus
      • label for attribute
      • required
      • Sign Up Form
      • input with type email
      • input with type password
      • input with type checkbox
      • Multiple Checkboxes
      • Multiple Select Box
      • input of type radio
      • checked attribute
      • textarea
      • placeholder attribute
      • title
      • autocomplete attribute
      • input with type number
      • min and max attributes
      • step attribute
      • input with type range
      • value attribute
      • Grouping Selection Options
      • input of type color
      • input of type date
      • input of type file
      • Grouping Form Fields
      • Tasks
    • Chapter 28 - Advanced CSS Selectors
      • Summary
      • Learning Goals
      • Pseudo-classes
      • Pseudo-elements
      • Other CSS Selectors
      • Tasks
    • Chapter 29 - HTML5
      • Summary
      • Learning Goals
      • HTML5
      • Semantic Elements
      • HTML5 Graphics
      • HTML5 Multimedia
      • Tasks
    • Chapter 30 - Some Other HTML Elements
      • Summary
      • Learning Goals
      • iframe
      • blockquote
      • code and pre
      • Tasks
    • Chapter 31 - Mobile Friendly Web Pages
      • Summary
      • Learning Goals
      • Introduction
      • The Viewport
      • Media Queries
      • A more complex example page with responsive design
      • Loading CSS files with media query
      • Responsive Images
      • Responsive Videos
      • Responsive Frameworks
      • Tasks

Causes Supported

Code Club

https://www.codeclub.org.uk

A nationwide network of volunteer-led after school coding clubs for children aged 9-11.

We create projects for our volunteers to teach at after school coding clubs or at non-school venues such as libraries. The projects we make teach children how to program by showing them how to make computer games, animations and websites. Our volunteers go to their local club for an hour a week and teach one project a week. Each term the students will progress and learn more whilst at the same time using their imaginations and making creative projects. Terms 1 & 2 use Scratch to teach the basics of programming. Term 3 teaches the basics of web development using HTML and CSS. Term 4 teaches Python and so on. We’d like to put a Code Club in every single primary school in the country. There are over 21,000 primary schools in the UK, it’s a big task but we think we can do it!

Authors have earned$9,108,966writing, publishing and selling on Leanpub,
earning 80% royalties while saving up to 25 million pounds of CO2 and up to 46,000 trees.

Learn more about writing on Leanpub

The Leanpub 45-day 100% Happiness Guarantee

Within 45 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.

See full terms

Free Updates. DRM Free.

If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).

Most Leanpub books are available in PDF (for computers), EPUB (for phones and tablets) and MOBI (for Kindle). The formats that a book includes are shown at the top right corner of this page.

Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.

Learn more about Leanpub's ebook formats and where to read them

Write and Publish on Leanpub

You can use Leanpub to easily write, publish and sell in-progress and completed ebooks and online courses! Leanpub is a powerful platform for serious authors, combining a simple, elegant writing and publishing workflow with a store focused on selling in-progress ebooks. Leanpub is a magical typewriter for authors: just write in plain text, and to publish your ebook, just click a button. It really is that easy.

Learn more about writing on Leanpub