HTML and CSS Tutorial - Create a Website for Beginners

Learn the basics of HTML and CSS in this complete tutorial. You will create a band website project using HTML and learn how to apply modern design in order to style the site using CSS.

⭐️ Course Contents ⭐️

⌨️ (00:00) Your first webpage
⌨️ (4:18) Basic HTML elements

⌨️ (14:20) Advanced HTML elements
⌨️ (27:22) Links and elements
⌨️ (42:19) CSS part 1
⌨️ (1:13:35) CSS part 2
⌨️ (1:36:09) CSS part 3

--

[WebDevSimplified]

Thanks for featuring my HTML and CSS tutorial Free Code Camp! If anyone has any questions let me know, because I would love to help out anyway I can.

Also, if you enjoyed this video please checkout my channel for more web development related tutorials.

[iVuDang]

I like that he clarified
- Div elements take up the whole width => will appear in the next line
- Span elements fits in line => appears in the same line

[nostalgiacinematicgamingk]

I spend $300 for this course of my country, but i get free of here. Amazed, this is the first im learned bout html, css and js. Keep it up ure great

[mayab]

I learned so much from you!! I am a beginner coder, I got stuck along the way, but with your method and how organized you are with assigning classes and explaining the reason you used flex in certain places and how you used pushed me so much further in my learning process. Thank

[austinebuenviaje]

This tutorial is just ok. It's moving pretty fast without much explanation on things. Web Developers who are going to watch this should be experienced in doing CSS. Pretty good tutorial tho.

[STUPIDYOUTUBE_HIDINGMSGS]

Thank you heaps for this, bro! Your tutorial has covered so much ground and amazing sections, unlike the other ones where the learning is so basic but took so much time and in the end you only learn fonts and colors, but not yours! Your video has manipulated shapes and images, up to the complete website, very impressive. All your tutorials are amazing, keep making them up!

[Amy-twzh]

Going into my 3rd year computer science course now and decided to pursue website development as my "specialty". This is super helpful and gives me strong foundation and understanding.

[camilapais]

Thank you so much for this! I have a project due for a Javascript course and they require HTML & CSS knowledge I didn't have! You've saved me <3

[amazingvladimir]

Thanks guys for lessons, i have scezofrenia and its hard for me to learn. But this totorials helping me, after work. My brain just feel, mutch better . And i trying to do new experience. thanks for the lessons:3 God bless you guys!

[LuosRestil]

As of June 25th, 2019, Visual Studio Code does not show a Reload button after installing the Liver Server extension, and the plugin will not work on a file that is not opened from within a folder. Opening an .html file on my desktop, the Go Live button does not appear. After dropping the .html file into a folder and opening the folder instead, the Go Live button does appear.

[AussieEntice]

Really good code along and learning resource.

Only criticism I have is the speed when duplicating sections and changing the content, yes the actions are pretty straight forward, but the speed makes it hard to catch up with your thoughts and comfortably follow in your own text editor. A bit slower would be great for beginners.

Overall great stuff, thanks for the content!

[Kayin]

just finished coding along with this video. Thank you so much for creating this. I will come back to this video and try it over and over :)

[iniyasankar]

I love this this helps me a lot. This is the best one so far . I had no idea about coding and this helps me a lot

[dilciafermin]

Thanks, I am trying to star coding again after long time and this tutorial is just right for me <:><

[Chaakmx]

That was a lot harder than i thought, i think i learned a lot.
Great video, had fun building the site!

[csl]

Update: it was as expected: A typo in the code.

ASSITANCE PLEASE. Issue area @: 1:35:06. I've doubled and tripled check and some more. All my codes are exactly the same, from the css to the htlm. However, I'm not getting the same exact results. Every things is pretty much similar except:
1. My Arena column is shifted to my City column creating a continuous string of text (only separated by a single space).
2. My "buy tickets" buttons are not equally lined up (vertically). Aside from the 2nd and 3rd row, the rest all starts at a random spot, In close proximity but still not aligned.

I'm running this on Chrome.

Any body else has this issue? Or if you had this issue, how would you code to correct it? (aside from me possibly just incorrectly copying the coding somewhere, which again I checked multiple times).

[libertyjoseph]

<Class = Amazing-5stars "You have done a fabulous job" Easy to follow and understand. God bless for sharing with us./>

[ericgraham]

Just finished the first 11:30:57 tutorial, hopefully this is a good place to go from there.
I'd give it an 90% since it was really fast so it was hard to follow at times but had lots of great information that helped me. I liked seeing how specific and organized the class tags were. I also liked how it got me thinking of how to keep things constant throughout the pages to avoid having to redo things.

[rajnishbailoor]

Great Course. Thanks for all efforts. Very nicely explained. well done. I have just began HTML with this video.

[veronicasalazarpereira]

Thank you so much for all your help. People like you is the best!