Learn CSS in 12 Minutes
HTML-код
- Опубликовано: 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
ruclips.net/user/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'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 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
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 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
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!
Wouldn't it be great if all tutorials were this phenomenally on point, clear and perfectly paced? A tour de force, Jake. brilliant stuff.
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
The way you started from pen and paper to coding !!! Great 12 minutes!
So glad I found your 12 minute videos. They are so easy to follow and your explanations are so clear. Thank you.
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.
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 is one of the best learning I've had in any 12 minutes. Great introduction, thank you.
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
Best and most useful video so far in explaining HTML/CSS!!! Well done and Thank you!
This happened when someone is mastering a subject. Thank you so much for this information. Cheers from Chile! :D
This is the best 12 minutes of my life on RUclips. 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
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!
Short, Precise and very informative.. definitely 'A Must Watch' for those interested in CSS & HTML
Great, loved the way its explained.you made CSS look so simple. great work
The most productive 12mins I have spend on RUclips in months! ..great work and well presented thanks!
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
Thank you for going straight to the point, great video!
This video is just plain awesome. It helped me out a LOT
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.
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.
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!
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!
FANTASTIC!!! The paper drawing/outline made all the difference to my understanding of css. TY for this!
This is the most straight forward tutorial I have ever seen in my entire life. I love it.
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 just couldn't control myself from commenting,best tutorial video ever ... great job 👏
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
Shout out to this guy for such an eloquent presentation. Never thought I would learn so much from such a short-limit video.
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!
What my teacher learned my in a couple of months, have you done in 12 minutes.
Well done!
Brilliant video! I wish I had stumbled onto this several years ago. Would have saved me lots of time and aggravation. Thanks so much!
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!!!
Such a great channel, you saved my life!
By far this is the best learn how to video I have ever seen! good use of the crawl, walk, run model.
Quick, well made, and easy to follow. The holy grail of tutorials. Thank you.
What your doing is epi,c man!! It really helped me out a lot! Please continue this series.
hi from the past!
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?..
Best 12 minutes, I spent in recent time. Thank you.
I haven’t done any CSS for years and this helped me refresh my memory. Thanks!
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!
it is the best video i have seen, thx
2hours of other videos couldn't teach me what you taught in 12 minutes. So glad i found this. Thank you!
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!
This could not have been better 👍👍
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!
Phenomenal ! I just started a coding program and this has clarified TONS of information and made it super east to understand!! thank you!!!
Your tutorials really helped me understand basic web programming in such a short time. Thank you!
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
12 minutes and 11 seconds! I want my money back! A good foundation to build upon, thank you :)
This is the best intro to CSS I have seen so far. Thank you.
Good lord you type fast my friend. Great video!
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.
This video is so far beyond helpful... probably the most useful I have ever seen on this site for any topic! Great work!
From a COMPLETE rookie/beginner - thank you! Really useful, and more 'real-world' than most of the tutorials I've seen.
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
Watching this before my job interview
did u crack
@@NithishS99 Nah they rejected me :(
@@NikhilYadav-mj6wj haha
@@NikhilYadav-mj6wj rip xD
Felt sad
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!!!
This is the most straight forward, concise intro. Very well done. Thank you.
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.
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 😂
😁😁😁
Probably the best video on the web! To the point and no time wasting.
Even 5 years later, this video is the best 12 minutes I have wasted on RUclips in 2019. Short, solid, useful CSS knowledge. Made for a great refresher. Thanks for making this video.
Super CSS Class
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.
My teacher assigned a 20 min video for "online" class and this helped me understand CSS so much more. TY
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.
Epic!
@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!
This man has taught me coding like school pal sit on same bench. Not so big mumble-jumble. Straight and simple. Big thanks dude
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!
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 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...
Hi Jake. This is a life saver. You are better that the years of videos I have watched.
It saved me man damnn..I've been doing CSS for like 2 weeks and confused how these boxes actually works. This explains everything I ever wanted. Thank you from 2021.
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!
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
One of the few ones that focus on explains from "what you want to get" and then "how write the code you need to get it", and not only "what happens, when you write especific codes", amazin work and love how you start from hand made -> coding -> final digital result
Literally the best youtube video I’ve watched in my life, thanks for the help man.
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😂
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!!!
You Sir have the midas touch in teaching. My years of css confusion was cleared in 12 mins with your video! i wish all teachers taught like this. Thank you very much!
You're too good my man. Great speed, great content, great voice. 12 minutes well spent!
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
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.
Brilliant. Your phlegmatic delivery and your concision is mad appreciated.
Great video. Iv watched quite a few professional videos and no one took the time to quickly draw it up on paper to show how you would work it out. Really helpful 👍🏼
Great class, but what is the goal of going so fast that a newbie is hardly able to follow?
Because most people are impatient and want the results immediately so I try to make the videos short in an attempt to actually teach some good practice to people who don't want to invest lots of time in learning languages thoroughly.
Jake Wright I understand, but I made a mistake somewhere and it's kind of hard to spot it afterward at this pace. I need to redo the whole thing and nobody's saving time doing that. But thanks anyway, these tutorials of yours are great! I'm a print graphic designer who is trying to learn html/css/javascript to follow the rest of the world in the internet adventure.
lecousinmachin you can slow the video down ;)
It's good for people who aren't newbies
Hans Langer exactly! I felt a little rusty and needed a quick refresher and as he sped along I followed because I understand and just needed some reminders. I guess that's where it's extremely useful