HTML CSS Tutorial for Beginners - Web Development Tutorials For Beginners

This video makes how CSS works easy to understand...it's just styles added to your page. You can do a lot with them, but at the end of the day, there's very little you have to know about CSS itself to start using it.
View the whole playlist of 2018 Web Development Tutorials for Beginners: • Latest Web Development...
Video 1: Professional setup with VSCode
• Web Development Tutori...
Video 2: HTML Tutorial for Beginners
• HTML Tutorial for Begi...
~-~~-~~~-~~-~
Also watch: "Tailwind CSS - why CSS utility classes save so much time"
• Tailwind CSS - why CSS...
~-~~-~~~-~~-~

[@tenc6491]

For a complete beginner like myself, your tutorials are like a mother feeding her child. I honestly mean this. Your teaching skills are awesome and I've already learned Html through your 11 minutes tutorial and now CSS. I know these are basics, but man, you've already laid a strong foundation for a beginner like me. Thank you again. Imma do the homework now and update it here.

[@dylbopp]

i know i've taken actual classes in school meant to teach me html but i've never been this far and intrigued before and i downloaded visual studio 20 mins ago

[@vkmuffins]

@@dylbopp oh my! This really shows how amazing of a teacher he is! He did the thing in just 11 mins when an academy couldn't even do that in months. He really is smth!

[@szaboferenc1141]

Probably the best html&css tutorial on youtube, i just want you to know man, YOU ARE AWSOME.

[@bowlerkid]

I just want to say "THANK YOU". Like I finally get it, keeping up pace with someone making the coding exciting rather than lecturing!!!

[@stevenvega719]

I went to ITT TECH for three semesters, and each semester was a video of yours. so basically, an entire semester was equivalent to one of your short videos. you are the man!!!

[@Lightdarksnake]

I'm so glad you've updated these tutorials! It's probably the one thing I look forward to every week right now haha.

[@theonlyv0ld332]

I'm a senior in high school and I can't believe that I'm learning this from watching your videos when my brother had to take a class in high school and college! Thanks for your help!

[@mintz97]

I started learning web development today for a change, and I was watching your old videos back from 2013! So glad that I clicked on your channel to see if you had an updated version! Turns out you have and you did it a few weeks ago :O! I'm just wondering if you will cover more things, I'm excited. Thanks a lot.

[@learncodeacademy]

Yes, this course will cover way more topics and go way further. Also, the next vid just came out kzbin.info/www/bejne/mn6ukGaifZaMhtE

[@vibration1028]

I m from India 🇮🇳 and I m an aeronautical Engineer. I will tell you one thing, I went to many web designers for my own website, but they asked around 2lacks indian ₹ , I wasn’t ready to pay this big amount in the begging of my business . Then I thought I can learn website development by somehow, (actually I want to sell my videos which is a complete course of Aerospace engineering so I m in need of that kind of website) Then I searched on google and I got your channel aft a long time . And I think I will end up with a proper knowledge bcs of your course . This is my third video, and I m starting this new journey of website development for my own educational website. And your way of explaining things is really very clear and it connects with next idea , thanks 🙏 a lot. Because I m a teacher 👨‍🏫 for aeronautics so I appreciate your videos sir . If really I will be able to learn all of the requirements I will surely mention your channel name . Thank you for these series sir.

[@TGSprod]

ma homie really gave me a homework 💀

[@aselgeia2668]

" please, do not ever choose comic sans" that literally killed me LOL

[@teenproductivity62]

Greek?

[@aselgeia2668]

Teen Productivity no just studying old greek

[@ItsNat21_]

Guess I'll use comic sans hehehe

[@nikolay.traykov5956]

Its just sheep suggestion, I know why everyone say it but still ...

[@r0yce]

Why did this guy make the whole HTML CSS thing so easy suddenly out of nowhere. It took me months to learn HTML in school and even then could never actually make a good webpage out of it.

[@youtubeconvector1948]

Something in which i can use my time in my holidays is this guys videos

[@vickygarcia7183]

I can´t tell you how thankful I am for your tutorials. As a beginner I've been searching for easy to follow steps like these and honestly you've helped me learn tons! Thank you kindly for this!

[@OrionHartwick]

Honestly I watched other videos and couldn't grasp it, but the way you taught it and the way it is clean and tidy has really made me understand it.

[@thesketchbank]

Sometimes a subject is not dull or hard to understand, the teacher is. But you made this so clear, I feel guilty for watching it for free

[@Longy0071]

I find these tutorials so much help. For anyone struggling with the basics but this is great.

[@teenproductivity62]

I am SOOOOO happy that I found your tutorials, you are the best teacher!

[@anthonynganga4221]

I knew I was going to watch the whole series series after I heard, "Please don't pick Comic Sans, please do not ever pick Comic Sans." Thanks for these videos, much appreciated. Lots of love from Kenya.

[@bensamsabu3047]

Just the kind of classes I prefer. Great job and thanks a lot.

[@Akab]

Me: "Just found out how to make round corners" Also me: "makes everything with rounded corners"

[@johnbond6806]

4/10 nt

[@reaper4142]

is it border-raduis ?

[@moviefree2997]

border-radius: 25px; background: #73AD21; padding: 20px; width: 200px; height: 150px;

[@benjaminnrgaard5266]

@@moviefree2997 Thank you for helping us out, your are a hero

[@karmafairy351]

YOU ARE AN AWESOME TEACHER! PLEASE MAKE MORE TUTORIALS! THANK YOU!

[@learncodeacademy]

Thanks so much!

[@sw3s1]

I can't believe that I actually did the homework without failing and giving up haha love the videos btw, been searching for this kind of tutorials for a long time and your videos are the perfect ones, thank you so much for the help

[@kang-dohsik4693]

How did you do it ): i tried so much , btw i searched for some of the tags he gives in here and i cant find them idk if uts because the text editor has been updated or ?? For example i couldn't find selector or property , for this homework i tried border , appearance border shape .....etc all of them give few choices such ass this weird sizing system or "inherit" Initial" unset" i know you need some extension or something to shape the button

[@adityakharel7452]

@@kang-dohsik4693 use border-radius tag and put the value 10px

[@NarutoUzumaki-hd5uz]

@@kang-dohsik4693 use border-radius command and give size accordingly mine worked with 5px

[@dtheijs496]

I'm so glad you have made all these tutorial you are really helping me out! Keep on doing this!

[@IrfanAli-eo1bb]

I did it.. And thanks for providing better videos like these 😍

[@Url_jay]

lol " Thaaat Font is Killing Me right now" lol ... He Teaches in a Very funny way and easy to follow ..Muc Appreciated

[@homecactus]

Why does my VS Code not have all of these autofill and colors like yours does?

[@bongtech75]

You are the best teacher in the world man.

[@toriannegianna]

These videos are extremely helpful. I've just finished taking freecodecamp's HTML and CSS courses, and they are a great resource, but your videos make it all seem so much simpler. Thank you so much!

[@jackie-y4c]

who would have thought i'd really be understanding this. thanks a bunch

[@cassio44peia53]

" you are really helping me , thank you sooooooooooo mmmmmmmmmmmmmmmuuuuuuuuuuuuuch "

[@fatihcikan6259]

Man istg ur the best i started learning like a week ago and all i was being told was boring tutorials but these videos are helping me so much Thank you so much and if i knew u in real life i could kiss u

[@shivasomasundaram1591]

6:50 I think we can make rounded corner button using a function called border-radius,am i correct?

[@Limpjerky]

Yes

[@arshpage]

6:46 I found the code for making it round!! Set a border radius and set it to something lower than 100 %

[@kang-dohsik4693]

I found the border radius but got overwhelmed with the many choices given cuz i couldn't understand them now i feel dumb i was literally one hair away from succeeding 🥴

[@deena_annmarie]

I did the hwwww In the button{ } brackets put -webkit-border-radius: 8px (Or any px depending on how round you want it) Thank you my website looks so cuteee I really enjoyed learning this and a junior in highschool who's mom doesn't let her do sports, this I was a fun thing to learn 🤭

[@eraticmongaloid]

i was just about to comment on one of your older videos and say you should make updated videos but then i found these luckily haha

[@mwendapoleee]

Am doing this in German and am not grasping it ,so I opted for my „mother tongue“.Thanxx a lot👍🏾🙏🏽👍👍🏻👍🏼👏🏾

[@hex__yts]

6:47 : it's not really hard, when you have the button selector, then make a property called border-radius: 6px; it gives you a really nice rounded corners..

[@mendokusai5823]

Hello. So I’m on macOS , exactly like your screen with two apps open vsc and live server, my question how do you save the code when you delete and create new code and save the page for it to show live on the other app ie live server. I keep clicking down on port5500 with every new changes and I see yours going very smoothly and instantly.

[@99Story-time]

To make the border of the button round, we can use the border radius property. you can do this: button{ border: solid; (it makes the border visible) border-radius:30px(it curves the border to 30 pixels) } happy learning :)

[@ProGamblerDom]

Four values - border-radius: 15px 50px 30px 5px; (first value applies to top-left corner, second value applies to top-right corner, third value applies to bottom-right corner, and fourth value applies to bottom-left corner):

[@ramitoumi1217]

first of all am really thankfull for these extremly helpful tutorials, I just wanted to ask if you can give us a video with all html name tags

[@julieb7059]

On my VS Code the font "prefill" does not show up for me. Is this an extension that is added? How do I get this?? ... PS your videos are incredible. SO easy to understand and you make is very simple. THANK YOU SO SO MUCH!!

[@RenzGJosol]

I love this man! Just received my first homework from him! HAHAHA love it

[@EverythingCrypto-w7n]

Please what did you write in place of property to turn the value red

[@aidameimanbek3375]

thank you for this lessons) but i have a problem with changing the fonts, font-family command doesnt work, i cannot fix it. What should i do?

[@rprojects8162]

so consise, so easy to follow, so helpful! also thanks for not putting in terrible background music!!!!

[@mihaelfintic2994]

Why don't I get color picker when I hover over name of a color

[@Alex_the_goat-1]

Border radius: can make it rounded

[@sirenti9384]

Hello, I hope you will continue these types of videos!!! I watched the further ones and I need to say that these are way better to understand :). So keep uploading more of this teaching stuff Greetings..

[@durgachinnu6900]

Hi , if I run the code in linkserver for every changes its opening a new tab in browser how??

[@GCAMATHTUTORIALS]

You helped me a lot. No words can express how thankful I am. 😍

[@cauat3051]

You explain way better than my school teather

[@juanrefan773]

Thanks dude !!! you make this look simple as a beginner i would recommend this to my friend

[@SIRA063]

everytime i right click and load the live server to check my qork, it loads a whole new page. IS that normal, or is there a button or macro i can press to qucikly just refresh it.

[@brayaon]

Muchas gracias por subir este tipo de contenido en 2018 y gratis. Saludos desde Colombia.

[@arabro3231]

we are waiting

[@agviraxsnilimonalisa7514]

is he alive? :D

[@learncodeacademy]

#4 just came out kzbin.info/www/bejne/mn6ukGaifZaMhtE . Sorry for the delay. I had twin babies and was out for a few months.

[@BiIboSwaggins]

@@learncodeacademy Congratulations on the babies ! :)

[@jkremis1423]

@@learncodeacademy Congratulations and thank you for all you've done to teach this topic in a positive and simple way!

[@dumbravatraian7222]

Great work, i hope you keep up creating more tut like these.

[@learncodeacademy]

#4 just came out kzbin.info/www/bejne/mn6ukGaifZaMhtE .

[@agviraxsnilimonalisa7514]

Yea yes yes i was waiting for it . Thank youuuuu you are doing best

[@Design.by.Hameed]

border-radius: 25px; homework is done hhhhhh please sir keep uploading its so fun i love the way you teach we not pay you but i am sure you will get a reward for this work.

[@ALEKSCRAFTPLAYY]

LearnCode.academy: Please don't pick comic sans Me who was about to create sans undertale website: **insert mike wazowski face swap meme here**

[@kneasypeasy7572]

lol

[@8mpgmafia109]

Where can I find the next video? Not sure if its released or still in the works?

[@brighleydangerfield]

Hello, Thank you for the videos! My uni textbooks are nowhere near as clear as this. However, i'm having trouble typing 'selector' and having the curly braces show up and also when I type h2 it changes to height: 2px;. I'm not sure what i'm doing wrong?? Thank you

[@rayrakero9450]

Hi, I'm new here in learning HTML. I got a problem, when I type selector for the CSS code, it doesn't turn yellow. Help me.

[@PaulGOfficialChannel]

yeah, same thing here

[@eric.1973]

@@PaulGOfficialChannel already know the answer?

[@PaulGOfficialChannel]

@@eric.1973 nope

[@eric.1973]

Frank Jaeger for me worked to restart

[@arberlimaj8740]

You are great at explaining. I love your your videos. Keep it up sir :)

[@Ayoub_Himself]

Great content man!!

[@dtheijs496]

Home work: Use border-radius and choose how much pixels you want to use for the button to be round.

[@littleredbeast7768]

Thanks mate, can you give me your example? I will not copy you, I ll change it so the teacher won t notice! Thanks again

[@puneetmaurya3094]

I m unable to open vs code and live server side by side. It is hectic to minimize window each time I wish to preview.Please help

[@nhasan2001]

It's very simple to make rounded corners of a box. I searched for it and apply it.

[@rahulmadad1484]

can you tell which software used by yourself in which you are doing this coding

[@robot_shutar323]

how come when i try to change the color of my text itt canges the background color

[@ankita_pal_0305]

Sir can you tell me please....is it necessary to keep the style tag in the head tag?

[@hannaakhtar3963]

Which software has been used??? Can you tell???

[@zachj7078]

Is internal CSS preferable over external or does is not matter? or maybe it's just preference? tah

[@thegoldenguy8203]

Use the border radius attribute and you can make the button round.

[@yuvarajbadiger700]

Why did the whole font (other than body, including title) change to your set fonts... The fonts within the body only should have changed right??

[@EldenSoulsVids]

css looks like java methods but this language doesnt really make sense to me. you have h1 at the top with attributes in it so it sets everything in h1 brackets to the same color. what if you had multiple h1 brackets and wanted the words inside to be different colors?

[@yannicknoutongtchoffo8946]

Home Work done waiting on the next video impatiently .

[@learncodeacademy]

Just released it! Sorry for the delay...I had twins and was out of commission for a few weeks! kzbin.info/www/bejne/mn6ukGaifZaMhtE

[@iseeflowers]

LearnCode.academy hi, very belated congratulations to your twin babies. Thank you for the videos.

[@MasterTee]

awesome :) Home work >> give any value to selector button with property border-radius to have rounded rectangle border .. the question here how could i remember all this properties when i want to use ..there is too much properties to know

[@davidrosenberger7630]

Master Tee most of it will become second nature after doing it over and over.

[@bx_h23]

And some of them use you more than others ;)

[@agviraxsnilimonalisa7514]

How many pixel did you guys did? I liked 14px 😂😂😂

[@MailsonWei]

You can be like me have a List if property and use different highlight colours to organise You probably will remember which property to use anyway.... practice makes perfect

[@mikej7476]

At 4:10 he types in "font" and all the font selections show. Mine does not. Anyone know why?

[@faithfullxfx1258]

Thank you so much for the videos the apps were so frustarring to try learn from almost gave up thank you ❤

[@ngndnd]

what if you want different colors for the h1's. For example u want to make the first h1 red and the second h1 green. How would u do that?

[@moonwatchereclipse5291]

classes, man. keep watching the videos

[@KachowProduction]

are there any major differences to the setup we use to code HTML and CSS? I watched your older videos when you had used 'Sublime', and wanted to know if its better to switch

[@umar56838]

Well, I think Visual Studio Code has a terminal and more options . There isn't that big of a difference and i recommend visual studio code just because its a bit faster to work with since it fills in tags for you and suggests stuff for you when your typing. Good luck on your coding journey!

[@rihaya2219]

hello sir im a beginner on a computer i wanna learn code program, how to install the app you use to code or what the app name?

[@haytispace]

😊watch the part 1

[@Resti-k4c]

I have a question, my mine is not working when i type "selector"?

[@izzycomedy-d6q]

can we use html , css and javascript to make a app

[@zarekasif6727]

2:38 what button did he clicked to access all colours? Please do tell....

[@invalid5777]

he hovered over it there i please do tell

[@xaviermortum8499]

which text editor r u using ????

[@jannesennen7400]

Great video. Love your contend!

[@kingsleyuche541]

My values, that's the colors don't pop out when I type them. hence making the text unable to change colors . What do I do?

[@kingsleyuche541]

That's to ask how you assess your color picker tool?

[@Maximus3214]

if you download a chrome extension called grepper it gives you user-submitted answers for coding in all sorts of different languages it is really helpful

[@Joke3rX]

Best tutorials ! Best teacher ! 👍👍👍 Looking forward to further updated videos :) ! Thanks for all of that !

[@learncodeacademy]

The next one just came out and more being edited as we speak kzbin.info/www/bejne/mn6ukGaifZaMhtE

[@isoulsi1929]

Hey how could i contact you for a project i want to make im trying to find people that are able to do web pages and design webs

[@venugopal488]

sir, i love ur tutorials..Easy to understand..Plz make next video i'm waiting

[@farrukhatabekov595]

button: border-radius:25px;

[@andreii1610]

yup

[@dankdoggo2943]

Didnt do my homework so thx dude.

[@eraticmongaloid]

how do you change this for specific buttons?

[@reddfoxx2542]

deserve ALOT more followers and likes GREAT VIDEOS THANX SO MUCCCHHHH!

[@lenitaclaassen3150]

I have a question . Should you learn all the CSS properties and selectors?

[@Everything.]

i will be supporting u from Nepal

[@Т1000-м1и]

My first thought was comic sans and then he's like don't pick comic sans...... well, I'll do a what's called a comic sans keyboard

[@effiongmfoniso5408]

What do you do if your font colour doesn't change??

[@SoicBR]

1:50 "using not that often". [Laughs in C#]

[@moonwatchereclipse5291]

hahahahaha

[@criseldamondares6818]

What app or website do you use in here?