Learn CSS in 12 Minutes
Вставка
- Опубліковано 14 січ 2014
- I introduce CSS, explain how to link a CSS file with an HTML document and teach the syntax of the language along with the most common properties.
Support this channel at / jakewright
---------- More tutorials ----------
Learn HTML in 12 Minutes: • Learn HTML in 12 Minutes
Learn More HTML in 12 Minutes: • Learn More HTML in 12 ...
Learn JavaScript in 12 Minutes: • Learn JavaScript in 12...
Learn PHP in 15 Minutes: • Learn PHP in 15 minutes
---------- Text editors ----------
For Windows users, I recommend using Notepad++ to edit HTML files:
notepad-plus-plus.org
For Mac users, I recommend Sublime Text:
www.sublimetext.com
SUBSCRIBE FOR MORE TUTORIALS
ua-cam.com/users/subscription_cente...
jakewright.net
Follow me on Twitter: / jaketvee
Like me on Facebook: / 267738313375279 - Наука та технологія
2 hours of lectures and 3 hours of lab exercises and you showed the same stuff in 12 minutes. Well done.
Thank you
without those 2 hours of lectures and 3 hours of lab exercises, you wouldn't have understood much from this video.
+Ian Dabre I disagree. Just watched this for the first time, without any prior html work, and pretty much understood it. It's not that complicated. Time to time I had to replay parts, but it's actually quite easy to understand..
cutipowinic so technically you watched the video for more than 12 minutes. if you had done a prior study of html even basics you could have watched this video without replaying any part. :)
+Ian Dabre
still even 5 replays < 5 hours
Paul Physman 5 replays > 12 minutes.
Anyone else watching in 2020? I didn't quite notice how old but relevant this video is !
I am just watching as well.
I am watching today
I have to make a html and css for school...
well html and css are waay older so..
Yes me to watching today
Comment{
Content quality: excellent;
Explanations: clear;
CSS: learnt;
Webpage: complete;
Hotel: Trivago;
}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vitae eros non urna aliquet dictum eget id sapien. Nulla sagittis, dui nec ullamcorper iaculis, magna velit vulputate dui, molestie ultricies lectus libero sit amet nisi. Curabitur quam est, faucibus at ante vitae, tincidunt pharetra nunc. In aliquet elementum blandit. Vestibulum gravida lacus et lobortis faucibus. Quisque velit eros, feugiat ut tempor vehicula, congue id est. Maecenas in odio ex. Maecenas vestibulum, justo eget cursus varius, erat neque laoreet diam, at placerat lacus mauris lacinia diam. Suspendisse sed orci nisi. Aliquam in sollicitudin risus. Fusce quis dictum massa. Duis vitae mattis tellus. Duis nunc leo, volutpat sed nulla ac, vulputate accumsan quam. Ut egestas bibendum massa, ac tempus urna maximus eget. Pellentesque vitae efficitur libero.
There are far more to learn about CSS than this. This is just very basic knowledge.
Hotel?
Gus Does Trivago
SWEEDEN
from now on i will use a paper to draw how the website should look with all the id's and stuff dope video man!
It's much helpful that way
As someone who codes, but is unfamiliar with html/css, this video was amazing.
same
A Nur they aren’t the standard languages to learn. There is no ‘standard’ language everyone must know to call themself a coder
Yes, same
hey i feel html is standard language if there was one
Same
well I think this is the best 12 minutes spent on youtube EVER. Good Job!
obliviontb i agree with that it is the best 12 minutes i spent
*college
I disagree.
I am one from india ... For us , english - speaking men are very fast as hindi is spoken slower than english... But this person speaks english slowly thus even reaching to more 1,25,00,00,000 people .... Or as you say , 1,250,000,000 more people
Thank u Jake wright
I don't normally leave comments after videos, but this is really a good tutorial. Quick and simple to learn. Thank you!
Nice
@@zxxczczczcz Noice
c r i n g e
CRINGE 😬
Dear Legend,
You are a legend
lol, i agree.. it's unbelievable.. all i needed at this moment of despair
Wouldn't it be great if all tutorials were this phenomenally on point, clear and perfectly paced? A tour de force, Jake. brilliant stuff.
i cannot emphasize to you how helpful this video has been for me. Nothing else worked, so many tutorials would beat around the bush and just never get to the point
I've been using html, and css for many years. This was the best 12 minutes I've seen, and it actually, and finally explained..WHY I have been doing all of it for so long without knowing why. Thanks. P.S. I'm 72. Started in 1995 on a Tandy.
Wow! You're old! (I don't mean to be rude, it's just shocking to find someone that old who still codes!)
Living legend here guys. I mean in good ways.
Super
I love how straight forward and to the point this video was. Its like every second of the video was valuable information. It wasn't skipping around looking for relevant information like I'd do with other videos. Thank you.
I'm trying to figure out why 18 people down voted this video. 12 minutes, fast talking, your first word of the video was starting instructions....SUBSCRIBED.
Andre Bowen Because you can't really fast track this stuff. If you don't know why it's called CSS, or can't tell the diff between classes and ID's, then you need to slow down a bit.
Brandon D Just change the speed in the settings so that it goes slower.
It didnt work for them
I'm only 2:45 in and I already have an appreciation for your style of teaching. The way you drew the webpage and marked it out makes it so clear! Subbed and Liked
The way you started from pen and paper to coding !!! Great 12 minutes!
all tutorials should be like this, well done my friend
maybe a little slower but yeah this is good
Yes, but explained a little slower. The pacing is too hard to keep up with if you have no experience with CSS
Quick, precise, very clear, and very informative. You are a very efficient but great teacher. Excellent, excellent work.
" You are a very efficient but great teacher" There is no contrast here, so "but" can be replaced with "and" to join the two clauses. :)
This was literally one of the most informative videos I’ve watched and I’ve been trying to learn as I go for about 9 months. Thank you so much!
I'm trying to relearn basic web design after 15 years and you have SAVED ME. I am a visual/kinesthetic learner and CSS tutorials are so hard to comprehend. Starting with the basic paper sketch was absolutely fantastic. I kept screaming while watching this because you finally helped so much make sense. Thank you thank you thank you!!!
Best and most useful video so far in explaining HTML/CSS!!! Well done and Thank you!
So glad I found your 12 minute videos. They are so easy to follow and your explanations are so clear. Thank you.
It took me only 1 day to learn html and css and all of that was possible only by these two 12 minutes videos
This man showed that it only takes 24 minutes to teach a whole concept of things
This happened when someone is mastering a subject. Thank you so much for this information. Cheers from Chile! :D
CSS is so incredibly powerful and so simple, but due to lack of instruction I've really been struggling with it. I always knew that if I could just have someone explain it simply and clearly, everything would click into place. This finally did it. Thanks!
Thank you for going straight to the point, great video!
This is one of the best learning I've had in any 12 minutes. Great introduction, thank you.
Shout out to this guy for such an eloquent presentation. Never thought I would learn so much from such a short-limit video.
Great, loved the way its explained.you made CSS look so simple. great work
This video is just plain awesome. It helped me out a LOT
Jake, I have to commend you on your style of teaching. You give the audience the tools to self-learn in a direct, concise manner. I only wish there was a library of these videos on all subjects. Well done!
One of the best tutorials I've ever watched. Thank you, Jake. 👌
Short, Precise and very informative.. definitely 'A Must Watch' for those interested in CSS & HTML
I just couldn't control myself from commenting,best tutorial video ever ... great job 👏
The most productive 12mins I have spend on UA-cam in months! ..great work and well presented thanks!
Amazing video!
I really like the clarity of the explanations and the way you projected everything on the screen; very bold and clear.
Thank you.
Thanks for saving 12 hours of my life!!!
This is so good. I needed to pause the video and tell you how simple and approachable you made CSS.
Thank you, I'm really glad that it's helpful :)
I thought this was the best of them. It came true!
Jake, your 12 minute videos are excellent. It's great to see how a pro approaches a subject. I love the way you set it up ready for the content. Thanks for posting.
I haven’t done any CSS for years and this helped me refresh my memory. Thanks!
Dude, thank you so much for this video. I am trying to learn webdesign, and I just can not get a hold of CSS. I appreciate the time you put into this! So easy to understand and thorough at the same time.
I learned a tremendous amount through this one video. I'm currently taking a web development class at my community college, and although we focus more on client/server applications, I still like to dress the pages up and make them look pretty.
I was able to take what you did here and use it as the foundation for my page design. Thank you for your help!
This is the most straight forward tutorial I have ever seen in my entire life. I love it.
This is the best 12 minutes of my life on UA-cam. This is 2021, and the difference between a teacher then and now is clear. Didnt even realise its old until I noticed the archaic windows style. Thanks man
Such a great channel, you saved my life!
What your doing is epi,c man!! It really helped me out a lot! Please continue this series.
hi from the past!
I love how you type out the multiple ways of showing something- explain why you are deleting text- and then show the shortcut.
This is quality content.
What my teacher learned my in a couple of months, have you done in 12 minutes.
Well done!
it is the best video i have seen, thx
Best 12 minutes, I spent in recent time. Thank you.
Quick, well made, and easy to follow. The holy grail of tutorials. Thank you.
This could not have been better 👍👍
Good lord you type fast my friend. Great video!
Your tutorials really helped me understand basic web programming in such a short time. Thank you!
This is the best intro to CSS I have seen so far. Thank you.
thank you! Explained it perfectly. ive had recent doubts surrounding my capabilities on web development seeing as im a creative and also an intellectual but i was intimidated by the word coding and the actual code because I did not understand this makes me so excited to start one of my newly found old passions. I cant think you enough for this video
+Breyana Anderson :D i too got interested in web designing bcoz of this awesome video and that awesome guy :D !
me too!
Thankyou!! I'm glad I found your vid. Whoelse is watching in 2019? 🙋🏻♂️
me too
i am learning
I have web techono class and I didn't learn anything on CSS for the whole week until I saw this
Me
me
This video is so far beyond helpful... probably the most useful I have ever seen on this site for any topic! Great work!
Phenomenal ! I just started a coding program and this has clarified TONS of information and made it super east to understand!! thank you!!!
You should make tutorials for all programming languages also. You're a great teacher.
I totally agree with you. He's great teacher
Are you else learn CSS and HTML?
Well, this is no programming language. Why are you assuming he knows anything on that topic?
You can't ask a skydiver to make tutorials on the rock climbing can you?..
12 minutes and 11 seconds! I want my money back! A good foundation to build upon, thank you :)
By far this is the best learn how to video I have ever seen! good use of the crawl, walk, run model.
My teacher assigned a 20 min video for "online" class and this helped me understand CSS so much more. TY
Jake, this is awesome!
I know CSS already, so the reason I watched this was that I didn't believe you can actually teach CSS in 12 minutes...
But now I know you can -- this video is an excellent introduction! Well done!
Thanks for this, am a newbie and I can follow. exactly what I needed . Glad I bump on this video. ;) I am looking for a mentor hopefully I can find someone I can shadow from.
hi Jake, just found your channel as someone who's learning to code ~pasito a pasito~ and felt this was a very simple and clear video, thanks so much!
This is probably the best vid I’ve seen explaining this. I’m more of a visual learner so the diagram u drew at the beginning literally put everything into context for me. 4min in n I had finally got the concept. Great vid! Thank you so much
Great tutorial series - Jake could you please consider making tutorials in Java, C++, C#, C, Python, etc as well? Thanks from all of us!
U tutorials there is code
Phython needed
Here's the code if anyone is interested (my version):
HTML: pastebin.com/DErr1fk3
CSS: pastebin.com/LgA9qZGp
+Mr. White it doesnt quite work
+Mr. White You sir are a good man. Just remember to put the CSS file type at he begginig +Alex Hesson
Hero.
Even 5 years later, this video is the best 12 minutes I have wasted on UA-cam in 2019. Short, solid, useful CSS knowledge. Made for a great refresher. Thanks for making this video.
2hours of other videos couldn't teach me what you taught in 12 minutes. So glad i found this. Thank you!
Watching this before my job interview
did u crack
@@NithishS99 Nah they rejected me :(
@@NikhilYadav-mj6wj haha
@@NikhilYadav-mj6wj rip xD
Felt sad
learn CSS in 6 minutes with 2X speed.
why click when you can watch the entire video while hovering the mouse above the thumbnail -JK
@@NithishS99 savage😲😲😎😎
@@NithishS99 whoa man, slow down 😂
@@NithishS99 😂
😁😁😁
FANTASTIC!!! The paper drawing/outline made all the difference to my understanding of css. TY for this!
THIS IS ABSOLUTELY AMAZING, THE MOST AMAZING VIDEO I'VE SEEN ON HTML
While the "learn html in 12 minutes" videos were brilliant and thought me everything I needed to know to start with HTML and create a desire to expand my knowledge by discovering new tags on my own and applying them on test websites this video I'm afraid was not good. It started off great with that piece of paper and it everything with the tags and the whole HTML part was clear to me, but then you started of with CSS too fast and introduced far too many CSS elements and although I understood what was happening it was nearly impossible to memorize everything. So I think you should do another CSS video which firstly starts with the explanation of hash and dot and then slowly go through all of the elements such as float, padding etc. simmilar to how you did your HTML videos. Hope you will take my suggestion seriously and do another video because you explained html in the most simplest way and I am sure you can do it with CSS too.
hey. if you need a more in depth tut for html/css or even actual programming languages like Python, etc. go to codecademy.com I learned there as well on how to code css.
Yes, a friend of mine also mentioned the same. Thx for the advice. Will look into it.
+Shoop Lor freecodecamp is really good too
Hazrijordan Thank you :)
+Moduhlize CodeAcademy is far insufficient for any proficient level. At my university it was discouraged to use such websites because they don't cover crucial fundamentals.
Epic!
I really appreciate your video series, including html i am new to all this but have dabbled around with it, but never really looked into it until i saw this and wow i cant believe how simple you made this tutorial. I paused it a couple times to catch up, as i was doing the html site with you and css on another page. Cant thank you enough.
Probably the best video on the web! To the point and no time wasting.
Super CSS Class
Hi, I'm doing this on mac and having a bit of difficulty, I think the codes are different for textedit so I was wondering if you could tell me the differences between coding in text edit and coding in notepad.
There is no difference in the code itself. the only thing some text editors will do is automatically place elements for you.
I code on a Mac and have 2 things to comment:
1. Try the program Brackets. It's free and amazing for coding HTML and CSS.
2. Did you save your code as .html & your stylesheet as .css? TextEdit automatically saves as .txt by default.
Noah Allen
Textwrangler is another good option. I use Textwrangler for all text whether coding or plain text on the Mac
me too! this is my 10th video trying to find out why my html window isnt reading my css link. I checked to see if the its saved in proper format. Somebody help!
This is the best 12 minutes I have EVER spent on UA-cam.
don't usually comment but this is something else. Everyone who teaches or does tutorials etc should watch this as an example.
Man explains everything, starts from 0 by drawing his idea on paper, creating the file showing every step, and explaining things well.
To me it's insane this is exactly what I needed
Yo can I ask you a question because u commented recently
How did you do that. The automatic closing of opening like ?
It is the program that does that. If you download Brackets (Free editor software for programming), it will also do it automatic :)
Thank you! I will download it asap :)
No problem! It's very good, i use it everytime i code :)
Any website recommendations? Where I can learn more of coding for free because I can't afford school now. I'm learning html css and javascript now.
Go to Udemy.com and look for deals. There are a lot of them. Look for the courses with the most students. Hope this helps!!!
@1:35"Subtract 10 ?" do I really have to know MATH to be a developer?
Surely you're joking? :L
Who knows
Jack Low
*nose
*knees
yes.. kidding .. (although I did hear that question)
PS: thank you so much for your great video man!
Hi Jake. This is a life saver. You are better that the years of videos I have watched.
From a COMPLETE rookie/beginner - thank you! Really useful, and more 'real-world' than most of the tutorials I've seen.
I have some trouble. The selected link doesn't go bold and the bullet points stay. Am I doing something wrong?
The text doesn't change either.
Me too
Seems to be that the word "selected" is somehow a reserved word and cannot be used to name a class. I change the name to something else and now works.
yea me too
Narigopia didnt work
Me: * Blinks *
Him: And thats how you code an AI that knows everything without any data
i mean he gave a good explanation but he just went over everything on a normal pace i just watched a 30 min html video so i was kinda lost but i understood so i guess he could go a little bit slower
I can say that what you were able to break down in 12 mins was explained precisely as I needed to understand it Your pace, and style of delivery is on point. I was able to grasp everything without the need to fell like I had to write anything down. Jake, thanks. I get it!
I'm so happy I could cry right now, thank you! New to this and my attempt to research and learn became quickly discouraging...but not anymore! Thanks again.
I did exactly everything you did. But my header didn't change colors. what did I do wrong?
same for me
did you change the styles file from styles.txt to styles.css?
did you reference the styles.css file from the html file?
did you id the divs properly?
pls, tell
i just did it a different way. i got it to work.
Starting my freelancing career in a few, wish me luck!
Good luck! I am hopefully looking to do the same, message me your email address and we can share some tips along the way? :D
@@SPAWN_DNB Nice idea bro, inbox me and we will message through our journeys!
@@countprogon I don't know how to inbox you on here haha! Inbox me and I will reply!
@@SPAWN_DNB me neither bruh😂
Dude. Thank you. Being self taught, I've managed to become very advanced in C# before learning basic html / css. It's pretty easy to pickup so this is way better for me than a 12 hour course meant for beginners. Absolutely perfect, even 8 years later.
You're too good my man. Great speed, great content, great voice. 12 minutes well spent!
Still helpful in 2019 😉👍
Yeah, but in 2029 everything has changed. I'm sorry
@@alejandroperez5368 for sure that Programming is in an Instantaneous developing speed every Year but with a Strong basic Ground AND keeping awareness of Upcoming Updates "that's what successful developers do"!
@@simpleprogrammer5834 HTML is not a programming language. The hell you talking about
@@alejandroperez5368 for sure you don't know what this video is about 😅
@@simpleprogrammer5834 I think you still don't know what HTML and CSS are. I'm sorry!! You need to look somewhere else
i thought it was a counter strike source (css) video lmao
@@sallo2718 Dang it, me too
lol
@@sallo2718 hahahahahaha u made my day
css stands for cascading stylesheet
pneumonoultramicroscopicsilicovolcanoconiosis sounds good...
Thank you for all the help!
Such a very kind of you.
This is the most straight forward, concise intro. Very well done. Thank you.
Anyone in 2022??
Nah 2024
2025