مواد پر جائیں
سبقEnglish

ایچ ٹی ایم ایل اور سی ایس ایس سیکھیں (فری کوڈ کیمپ)

از freeCodeCamp.org

کورس کی زبان
کورس کی زبان: انگریزی
سطح
ابتدائی
دورانیہ
97 اسباق · 5.4 گھنٹے

آپ کیا کر سکیں گے

  • سیمینٹک ایچ ٹی ایم ایل سے صفحات کی ساخت بنا سکیں
  • سی ایس ایس اور فلیکس باکس سے لے آؤٹ بنا سکیں
  • ویب سائٹ مفت شائع کر سکیں

اس کورس کے بارے میں

فری کوڈ کیمپ کا آسان، پراجیکٹ پر مبنی ایچ ٹی ایم ایل اور سی ایس ایس کورس (اسکریمبا کے پر بورگن)، 97 ابواب: ٹیگز، تصاویر، خبر کا صفحہ اور گوگل جیسا صفحہ بنانا، سی ایس ایس، فلیکس باکس، گوگل فونٹس، اور گٹ ہب ڈیسک ٹاپ سے سائٹ شائع کرنا۔ تقریباً ساڑھے 5 گھنٹے۔ آڈیو انگریزی میں ہے۔

شروع کرنے سے پہلے: کوئی نہیں

نصاب

97 اسباق · کل 5:21:44

  1. 1Introduction1:32
  2. 21: Welcome to the HTML & CSS Course2:40
  3. 32: HTML Tags3:21
  4. 43: Write a news article2:10
  5. 54: The image tag5:00
  6. 65: Nesting2:50
  7. 76: Internet superpowers - Change the BBC news!5:01
  8. 87: Interactive elements - Button2:03
  9. 98: Interactive elements - input tags -- Experiment with input types 100%5:00
  10. 109: Let’s build Google!3:51
  11. 1110: Aside - Anchor tags4:36
  12. 1211: Add an anchor tag to Google.com1:39
  13. 1312: Proper document structure5:46
  14. 1413: Aside: Lists3:58
  15. 1514: Build a personal Website8:48
  16. 1615: Deploy your Personal Website3:15
  17. 1716: HTML Recap1:36
  18. 181: Let’s learn CSS!0:47
  19. 192: Write your first lines of CSS!4:17
  20. 203: Write your first lines of CSS! Solution3:36
  21. 214: Let’s destroy wikipedia - recording1:57
  22. 225: Link to the CSS file2:39
  23. 236: Set the width of the elements2:09
  24. 247: Inline vs block elements2:18
  25. 258: Margin top1:16
  26. 269: Divs rule the world2:05
  27. 2710: CSS classes3:57
  28. 2811: Aside - Learn margins via flags5:57
  29. 2912: Add space between our elements1:08
  30. 3013: Aside - Centering with margins3:27
تمام 97 اسباق دکھائیں
  1. 3114: Centering our content1:22
  2. 3215: Aside - padding5:22
  3. 3316: Aside - Border and border-radius5:10
  4. 3417: Aside challenge - style Twitter button5:03
  5. 3518: Fix the input field4:46
  6. 3619: Center the button2:20
  7. 3720: Style the button4:31
  8. 3821: Why we can’t have two block-level buttons4:29
  9. 3922: Aside - Flexbox3:43
  10. 4023: Centering both buttons with flexbox2:55
  11. 4124: Google clone recap2:40
  12. 422: Fix the image path2:56
  13. 433: Add alt attribute4:28
  14. 444: Make image smaller1:16
  15. 455: Add a border and padding3:50
  16. 466: Aside - flexbox child containers3:41
  17. 477: Flex item containers1:40
  18. 488: Add a utility class3:13
  19. 499: Justify the items2:09
  20. 5010: Center the card2:00
  21. 5111: Aside - inheritance4:18
  22. 5212: Center the text via inheritance3:01
  23. 5313: Add colors3:25
  24. 5414: Web-safe fonts5:09
  25. 5515: Aside - margin/padding shorthand4:03
  26. 5616: Use the margin & padding shorhands1:17
  27. 5717: Deploy your Digital Business Card4:50
  28. 5818: Business Card Recap2:38
  29. 592: Add a background image from unsplash4:00
  30. 603: Center elements and Style button3:18
  31. 614: Add a Google font4:22
  32. 625: @font-face2:05
  33. 636: Aside - spans3:58
  34. 647: Add an underline using a span1:50
  35. 658: Use an ID for the logo4:24
  36. 669: Replace the jpg with a webp2:34
  37. 6710: Choose a color palette from an image2:53
  38. 6811: Add the terms & conditions section3:59
  39. 6912: Aside - text shadow6:00
  40. 7013: Improving the readability with text shadows2:00
  41. 7114: Space - Exploration recap1:45
  42. 721: Let’s build a Birthday GIFt site1:11
  43. 732: Add basic header styling3:34
  44. 743: Set the colors1:26
  45. 754: Add shadow on text3:21
  46. 765: We have a problem that flexbox can fix2:36
  47. 776: Aside - align-items6:03
  48. 787: Aside - flex-direction4:29
  49. 798: Turn the header into a flexbox1:44
  50. 809: Fix date and age design4:10
  51. 8110: Create the first gift5:20
  52. 8211: Replace the img with a div4:18
  53. 8312: Aside - make elements change on hover2:54
  54. 8413: Add the hover effect2:09
  55. 8514: Create the next GIFt4:22
  56. 8615: Create two more GIFts2:36
  57. 8716: Create the final GIFt3:23
  58. 8817: Add the footer3:40
  59. 8918: Add a background gradient3:28
  60. 9019: Personalize the Birthday GIFt Site1:39
  61. 9120: Use GitHub Desktop to publish your Birthday GIFt Site5:19
  62. 9221: Deploying your Birthday GIFt Site1:01
  63. 9322: Use VS Code to edit your Birthday GIFt4:51
  64. 9423: GIFt site recap1:53
  65. 951: It’s time to go solo!2:18
  66. 962: Solo Project - Hometown Homepage4:07
  67. 973: Congrats on completing the course!1:50

اس کے بعد کیا سیکھیں

متعلقہ کورسز

ویڈیوز freeCodeCamp.org کی، ان کے آفیشل یوٹیوب چینل سے۔ یوٹیوب پر سبسکرائب کریں

استاد یا ادارے کی اپنے چینل پر آفیشل اپ لوڈ، یوٹیوب کے ایمبیڈڈ پلیئر میں دکھائی گئی۔

اسباق کی آخری جانچ: اکتوبر 2026۔ کورس کا خلاصہ اور اسباق کی ترتیب سبق کی طرف سے۔

اس کا حصہ: صفر سے ویب ڈیولپمنٹ

مسئلہ یا حقوق کی درخواست رپورٹ کریں