HTML/CSS Tutorial – Build a Beautiful Blog



If you’ve ever been curious to learn HTML and CSS but found yourself frustrated along the way, this course is for you. Watch it here or experience the interactive version on Scrimba: https://scrimba.com/g/gbuildablog

About the course:

I’m Zaydek, and I’ve built a few websites. In the process, however, I’ve found myself overwhelmed with the syntax and baggage of HTML and CSS. In this course, I provide a brief introduction to HTML and CSS (hopefully!) without the pain I had to first endure.

I’ll teach you learn how to start from scratch and architect something that would then be meaningful for you and others.

⭐️ Course Contents ⭐️
⌨️ 1. Introduction – 0:00
⌨️ 2. A Brief Introduction to HTML and CSS – 1:08
⌨️ 3. What is a CSS Reset and Debugger – 4:49
⌨️ 4. Getting Started with CSS Grid – 7:37
⌨️ 5. Iterating our CSS Grid – 12:40
⌨️ 6. Getting Started with Images – 16:17
⌨️ 7. Text Elements, part 1 – 20:23
⌨️ 8. Text Elements, part 2 – 24:17
⌨️ 9. Text Elements, part 3 – 29:21
⌨️ 10. Images (continued) and Social Media Buttons – 32:10
⌨️ 11. Last Articles with Gradients – 39:08

If you have questions, comments, or feedback, reach out to me on Twitter: https://twitter.com/username_zaydek

Learn to code for free and get a developer job: https://www.freecodecamp.com

Read hundreds of articles on programming: https://medium.freecodecamp.com

39 thoughts on “HTML/CSS Tutorial – Build a Beautiful Blog”

  1. Hello! Thanks for the tutorial, I just had a problem, when I add the media query to make the font size responsive, it doesn't seem to make any difference to the text when I resize my browser.

    Reply
  2. Hello, I am from the boss of mygoldgame company, I want to talk to you about our company's business cooperation. Please contact me! You will definitely get rich returns. Our company guarantees that you can earn thousands or tens of thousands of rupees every day. This is my (Telegram) APP account +91 94005 30781 whatsAPP + 91 82923 08336,

    Reply
  3. Hello, I love your tutorial I learn codes thru your tutorial, my problem is in the hover effect it don't work on my end, is it possible that my text editor is outdated and what text editor tool do you used?

    Reply
  4. When adding the cosmos images, why is the bottom one smaller? At 18:34 in the screenshot of the site in the bottom left the bottom image is smaller for no apparent reason, and I ran into this as I was coding along. You can change the class of the 4th image so size 2, 3 or 4 and it's fine but size-1 makes it an odd size for some reason.

    Reply

Leave a comment