Học css khó như thế nào?

Đây là một chủ đề tuyệt vời của Kevin Powell đang lan truyền. Anh ấy tin rằng rất nhiều người coi CSS là một ngôn ngữ khó chịu và khó chịu

Điều đó thật khó hiểu khi JS bắt đầu đếm từ 0, nhưng vì bạn đã học được điều đó và chấp nhận nó nên không sao cả.

Vấn đề thực sự không nằm ở CSS. Nếu bạn gặp khó khăn với nó, hoặc từng gọi nó là không trực quan, thì có thể là do bạn không thực sự hiểu CSS hoạt động như thế nào.

– Kevin Powell (@KevinJPowell) ngày 24 tháng 2 năm 2020

Tại sao mọi người tôn trọng JavaScript hoặc các ngôn ngữ khác đủ để học chúng từ trong ra ngoài, nhưng lại liên tục tìm hiểu về CSS?

Không giống như ngôn ngữ lập trình yêu cầu kiến ​​thức về vòng lặp, biến và các khái niệm khác, CSS khá dễ tiếp thu. Có lẽ vì điều này mà nó đã nổi tiếng là đơn giản. Nó đơn giản theo nghĩa “không phức tạp”, nhưng điều đó không có nghĩa là nó dễ dàng. Nhầm lẫn “đơn giản” với “dễ dàng” sẽ chỉ dẫn đến đau lòng

Tôi nghĩ đó là điều đã xảy ra với một số lập trình viên lần đầu tiên đến với CSS. Họ đã nghe nó đơn giản, vì vậy họ cho rằng nó dễ dàng. Nhưng sau đó khi họ cố gắng sử dụng nó, nó không hoạt động. Chắc là do lỗi ngôn ngữ, vì họ biết họ thông minh, và điều này được cho là dễ dàng. Vì vậy, họ đổ lỗi cho ngôn ngữ. Họ nói nó bị hỏng. Và vì vậy, họ cố gắng “sửa chữa” nó bằng cách làm cho nó phù hợp với cách suy nghĩ có lập trình hơn

Đã có lúc tôi ngồi lại với các kỹ sư để trao đổi với họ về một vấn đề phức tạp về bố cục và CSS được coi là kém hơn họ - như thể ngôn ngữ này bằng cách nào đó quá khó đoán để đảm bảo việc học và thành thạo. Có lẽ điều này có liên quan đến quá khứ, nơi mà chúng ta đã dành nhiều năm đấu tranh để thay đổi cách trình duyệt hiển thị mọi thứ. Nhưng đây chủ yếu là một vấn đề được giải quyết. Tôi không thể nhớ lần cuối cùng tôi chiến đấu với các trình duyệt như thế là khi nào

Thay vào đó, tôi cho rằng vấn đề lớn nhất mà các kỹ sư phải đối mặt — và lý do tại sao họ cảm thấy rất khó chịu — đó là CSS buộc bạn phải đối mặt với sự phức tạp của trang web. Mọi thứ yêu cầu dự phòng. Bạn cần xem xét các thiết bị khác nhau và tất cả các cách khác nhau để xem một trang web. di động, máy tính để bàn, không chuột, không bàn phím, v.v. Chắc chắn, bạn cũng phải giải quyết vấn đề đó khi viết JavaScript, nhưng sẽ dễ bỏ qua hơn. Bạn không thể bỏ qua bố cục trang web của mình bị phá vỡ hoàn toàn trên điện thoại

lưu ý bên lề. Chúng tôi có hướng dẫn về căn giữa trong CSS không phải vì CSS bị hỏng và ngớ ngẩn, mà bởi vì có quá nhiều biến số đến mức một câu hỏi đơn giản như "Làm cách nào để căn giữa văn bản?" . Có quá nhiều bối cảnh bị bỏ lỡ

Điều này làm tôi nhớ đến một trong những bài đăng trên blog yêu thích của tôi mọi thời đại, nơi Brandon Smith lập luận rằng CSS thật tuyệt vời và chúng ta nên tôn trọng ngôn ngữ này cũng như tìm hiểu cách thức hoạt động của nó.

CSS khó vì các thuộc tính của nó tương tác với nhau, thường theo những cách không mong muốn. Bởi vì khi bạn thiết lập một trong số chúng, bạn sẽ không bao giờ chỉ thiết lập một thứ. Một thứ đó kết hợp và nảy ra và mâu thuẫn với hàng tá thứ khác, bao gồm cả những thứ mặc định mà bạn không bao giờ thực sự đặt ra cho mình

Một nguyên tắc nhỏ để giảm thiểu điều này là, không bao giờ rõ ràng hơn mức cần thiết. Các trang web được đáp ứng theo mặc định. Viết CSS tốt có nghĩa là tận dụng thực tế đó thay vì ghi đè lên nó. Sử dụng tỷ lệ phần trăm hoặc đơn vị khung nhìn thay vì truy vấn phương tiện nếu có thể. Sử dụng min-width thay vì width nếu bạn có thể. Hãy suy nghĩ về các quy tắc, về những gì bạn thực sự muốn nói, thay vì chỉ thêm các thuộc tính cho đến khi mọi thứ trông ổn. Cố gắng cảm nhận cách trình duyệt giải quyết bố cục và kích thước, đồng thời thực hiện các thay đổi và bổ sung của bạn trên đó một cách thận trọng. Làm việc với CSS, thay vì chống lại nó

Bạn đã bao giờ tự hỏi làm thế nào các trang web yêu thích của bạn được thiết kế? . Đôi khi, mã CSS là thứ mang lại một kế hoạch chi tiết thành hiện thực. Cascading Style Sheets, hay CSS, là ngôn ngữ lập trình được các nhà phát triển sử dụng để xác định tính thẩm mỹ của trang web. Trong khi HTML, một ngôn ngữ đánh dấu, cho phép bạn thiết lập cấu trúc cho một trang web, thì CSS cho phép bạn xác định cách các tính năng của trang web xuất hiện. Nếu bạn muốn học CSS, hướng dẫn này là dành cho bạn

HTML và CSS làm việc cùng nhau. Khi bạn nhìn thấy một tiêu đề sử dụng một phông chữ mới trên một trang web, HTML được sử dụng để biến đoạn văn bản đó thành một tiêu đề. Sau đó, CSS được sử dụng để đặt phông chữ của nó. Tiếp theo, hãy xem xét một đoạn văn bản. HTML sẽ được sử dụng để xác định văn bản dưới dạng một đoạn văn. Sau đó, các kiểu CSS sẽ được sử dụng để thay đổi màu sắc của nó. Như bạn có thể thấy, học CSS sẽ giúp bạn xây dựng các trang web sáng tạo

Hướng dẫn đầy đủ này sẽ hướng dẫn bạn cách học CSS và cách tốt nhất để học CSS trực tuyến. Chúng tôi sẽ cung cấp cho bạn một loạt các bước rõ ràng mà bạn có thể làm theo để giúp bạn bắt đầu hành trình học CSS một cách nhanh chóng và hiệu quả. Nếu bạn muốn học viết mã CSS, hãy tiếp tục đọc phần bên dưới

Học css khó như thế nào?

Tìm trận đấu Bootcamp của bạn

  • Career Karma kết hợp bạn với các bootcamp công nghệ hàng đầu
  • Truy cập học bổng độc quyền và các khóa học chuẩn bị
Chọn sở thích của bạn
Tên

Họ

Email

Điện thoại .


By continuing you agree to our Terms of Service and Privacy Policy , and you consent to receive offers and opportunities from Career Karma by telephone, text message, and email.

CSS được sử dụng để làm gì?

Học css khó như thế nào?
Học CSS là chìa khóa nếu bạn muốn trở thành nhà phát triển web hoặc kỹ sư phần mềm toàn diện

CSS được sử dụng để xác định cách một phần tử trên trang web sẽ xuất hiện. CSS là viết tắt của Cascading Style Sheets. Các kiểu có thể được áp dụng bằng CSS trên tài liệu HTML hoặc trong một biểu định kiểu riêng. CSS có thể được sử dụng để tùy chỉnh giao diện của trang web

Sử dụng CSS, các nhà phát triển viết các quy tắc kiểu, cho trang web biết cách một phần tử HTML nhất định sẽ xuất hiện trên trang web. Chẳng hạn, một quy tắc kiểu có thể xác định chiều cao và chiều rộng của hình ảnh trên trang web. CSS có thể được sử dụng để đặt kích thước của văn bản trên trang web

Ngôn ngữ CSS cung cấp một loạt các thuộc tính, được sử dụng để áp dụng các kiểu cho các thành phần khác nhau trên trang web. Các thuộc tính này liên quan đến kích thước của một phần tử, màu sắc, đường viền của phần tử, vị trí phần tử xuất hiện trên trang web, v.v. Dưới đây là một vài quy tắc khác nhau mà bạn có thể gặp trong CSS

  • kích thước phông chữ đặt kích thước của văn bản trên trang web
  • color đặt màu của văn bản trên trang web
  • height đặt chiều cao của một phần tử trên trang web

Mỗi thuộc tính CSS được gán một giá trị, cho trình duyệt biết một phần tử nhất định sẽ xuất hiện như thế nào. Ví dụ: CSS có thể được sử dụng để yêu cầu trình duyệt làm cho tất cả văn bản có màu xanh lam. Khi bạn tìm hiểu các nguyên tắc cơ bản của các thuộc tính CSS, bạn có thể sử dụng các kiến ​​thức cơ bản đã học để xây dựng các thiết kế phức tạp và rắc rối

Tại sao bạn nên học CSS?

Đối với một điều, học cách viết mã trong CSS cung cấp cho bạn khả năng tạo các thiết kế trang web của riêng bạn. Chẳng hạn, học CSS sẽ cho phép bạn tạo một danh mục đầu tư mà không cần dựa vào các mẫu chứng khoán. Nếu bạn học CSS, bạn có thể tạo ra thứ gì đó độc nhất cho mình. Một trong những lý do chính tại sao bạn nên sử dụng CSS là nó mang lại cho bạn nhiều khả năng sáng tạo hơn

Và chúng ta thậm chí còn chưa thảo luận về lợi ích nghề nghiệp của việc học cách viết mã trong CSS. Không thiếu những nhà tuyển dụng đang tích cực tìm kiếm những người có thể viết mã bằng CSS. Bởi vì các nhà phát triển CSS tài năng đang có nhu cầu nên mức lương cũng cao. Tại thời điểm viết bài này, Glassdoor báo cáo mức lương trung bình cho một nhà thiết kế web là $58,517, một khoản tiền ấn tượng

Mất bao lâu để học CSS?

Có thể mất vài tuần để học CSS. Trước khi học CSS, chúng tôi khuyên bạn nên dành vài tuần để thực hành HTML. Sẽ không mất nhiều thời gian để thành thạo và bạn sẽ có một chỗ đứng vững chắc trong thế giới lập trình. HTML có thể giúp bạn cảm nhận về cú pháp cơ bản, điều này sẽ rất hữu ích khi học CSS

Khi bạn hiểu HTML và có thể xây dựng các trang web tĩnh của riêng mình, bạn đã sẵn sàng để bắt đầu học CSS. Giống như ngôn ngữ đã nói ở trên, việc học các chức năng cơ bản của CSS có thể mất chưa đầy một tháng. Tuy nhiên, CSS mất nhiều thời gian hơn để thành thạo và chúng tôi khuyên bạn nên thực hành từ hai đến bốn giờ mỗi ngày

Học CSS có khó không?

CSS là một ngôn ngữ lập trình dễ học ở mức cơ bản. Công nghệ CSS được thiết kế để có thể truy cập, vì vậy bất kỳ ai cũng có thể tạo các trang web theo kiểu của riêng mình trên Internet. Rất nhiều cú pháp bạn thấy trong CSS sẽ rất quen thuộc khi bạn tìm hiểu các khái niệm cơ bản về HTML. Vì vậy, CSS không khó học, đặc biệt nếu bạn hiểu các nguyên tắc cơ bản của HTML

Chẳng hạn, bạn có thể thay đổi một số thuộc tính như chiều cao và chiều rộng cho một hình ảnh cụ thể trong tệp HTML của mình. Tuy nhiên, nếu bạn muốn áp dụng điều đó cho tất cả các hình ảnh trên trang của mình thì sao?

Hãy nhớ rằng, CSS tương tác với các phần tử HTML theo cách tương tự như các thuộc tính trong các thẻ phần tử trên tệp HTML. Tuy nhiên, bạn có thể chạm vào nhiều yếu tố cùng một lúc thông qua các khối mã trong CSS được gọi là quy tắc. Nếu bạn cảm thấy thoải mái khi tạo kiểu cho tất cả các phông chữ, màu sắc và hình ảnh của mình trong HTML, thì bạn sẽ không gặp vấn đề gì khi làm việc với CSS. Bạn thậm chí sẽ thấy việc tạo bố cục CSS dễ dàng hơn khi bạn hiểu rõ về nó

Học css khó như thế nào?

"Career Karma bước vào cuộc đời tôi khi tôi cần nó nhất và nhanh chóng giúp tôi phù hợp với bootcamp. Hai tháng sau khi tốt nghiệp, tôi đã tìm được công việc mơ ước phù hợp với giá trị và mục tiêu của mình trong cuộc sống. "

Venus, Kỹ sư phần mềm tại Rockbot

Find Your Bootcamp Match

Cách học CSS

Học css khó như thế nào?
Sinh viên tương lai có thể đăng ký vào một bootcamp viết mã để học CSS

Cho đến giờ, chúng ta đã dành thời gian xem xét nền tảng của CSS và lợi ích của việc học cách viết mã bằng CSS. Nhưng bây giờ, chúng ta phải trả lời câu hỏi. Làm thế nào để bạn thực sự bắt đầu học CSS?

Có hàng nghìn tài nguyên trực tuyến có thể giúp bạn học CSS. Với rất nhiều sự lựa chọn, việc tìm ra nơi bắt đầu khi học CSS có thể khó khăn. Hãy cùng điểm qua một số bước chính mà bạn nên làm theo để giúp bạn bắt đầu hành trình học CSS nhanh chóng

Bước 1. Nắm vững những điều cơ bản

Để có thể học CSS, bạn cần bắt đầu bằng cách nắm vững kiến ​​thức cơ bản về CSS. Chắc chắn, bạn có thể muốn bắt đầu nghiên cứu cách xây dựng các thiết kế trang web phức tạp. Tuy nhiên, nếu không nắm vững kiến ​​thức cơ bản về CSS, bạn sẽ gặp khó khăn trong việc hiểu các khái niệm nâng cao hơn khi chúng xuất hiện trong mã của bạn

Bước đầu tiên trong hành trình học ngôn ngữ biểu định kiểu này của bạn là đầu tư thời gian vào nghiên cứu—và thực hành—những kiến ​​thức cơ bản về CSS. Điều này sẽ liên quan đến việc tìm hiểu về cú pháp, đó là các quy tắc chung mà bạn nên tuân theo khi viết mã CSS, bộ chọn, mô hình hộp, v.v. Để giúp bạn bắt đầu, đây là danh sách các chủ đề chính mà bạn cần biết

  • Bộ chọn và cú pháp CSS
  • Mô hình hộp
  • phần tử hiển thị
  • Màu sắc và Phông chữ
  • lưới

Bước 2. Học CSS trực tuyến với hướng dẫn

Có một số ấn phẩm cung cấp các hướng dẫn CSS tuyệt vời. W3Schools và Mozilla Developer Network rất hữu ích khi bạn tìm hiểu các khái niệm về ngôn ngữ lập trình. Các tài nguyên này cung cấp các hướng dẫn tiêu chuẩn trực tuyến cùng với các bài tập về từng khái niệm

Các tài nguyên trước đây phù hợp khi bạn muốn nghiên cứu các khái niệm và hiểu tại sao chúng lại cần thiết cho việc viết mã. Khi bạn đã hiểu được điều đó, đã đến lúc bạn phải dồn hết tâm trí vào công việc để xem mình đã học được bao nhiêu. Nhiều tài nguyên có sẵn để trợ giúp bạn khi bạn đang di chuyển, như Grasshopper , SoloLearn và Codecademy. Họ có những ứng dụng tuyệt vời mà bạn có thể tải xuống và sử dụng để học CSS

Ngoài ra, các trang web như freeCodeCamp , The Odin Project và Khan Academy cung cấp các khóa học hoàn toàn miễn phí tập trung vào việc dạy CSS. Cùng với những bài học này, bạn có thể truy cập các dự án được thực hiện để giúp bạn học cách viết mã CSS trong khi nghiên cứu các khái niệm

Làm theo hướng dẫn là một cách tuyệt vời để học HTML. Bạn sẽ học cách phát triển bằng cách thực hiện HTML thay vì chỉ đọc về nó. Học thực hành là rất quan trọng khi phát triển web front-end vì mức độ sáng tạo liên quan

Bước 3. Xây dựng một dự án

Các dự án CSS là một cách tuyệt vời để áp dụng lý thuyết bạn đã học vào thực tế và làm việc với thứ gì đó mà bạn hoàn toàn hứng thú. Đúng rồi. Khi bạn chọn một dự án CSS để thực hiện, bạn sẽ không còn phải xây dựng những gì hướng dẫn yêu cầu bạn xây dựng

Làm việc trên dự án CSS của riêng bạn cũng mang đến cho bạn cơ hội tự do sáng tạo trong công việc của mình. Vì CSS là một ngôn ngữ có tính trực quan cao nên bất kỳ dự án nào bạn xây dựng đều có thể dễ dàng trở thành của riêng bạn. Bạn có thể chọn phông chữ hoặc màu phông chữ của riêng mình và cũng có thể tùy chỉnh trang web theo ý muốn

Tôi nên xây dựng cái gì? . Sự thật thì không có câu trả lời đúng. Bạn có thể xây dựng bất cứ thứ gì bạn muốn

Tuy nhiên, khi bạn bắt đầu, tốt nhất là nên bắt đầu với số lượng nhỏ, sau đó làm việc theo cách của bạn để tạo ra các thiết kế phức tạp hơn. Đảm bảo rằng dự án CSS mà bạn chọn để xây dựng là thứ mà bạn thấy thú vị. Nếu bạn đã chọn một dự án CSS thú vị và gặp khó khăn, bạn sẽ dễ dàng tìm thấy động lực cần thiết để hoàn thành công việc của mình

Ý tưởng dự án CSS

Có nhiều dự án CSS khác nhau mà bạn có thể bắt đầu để giúp xây dựng kỹ năng của mình. Mục đích của việc học CSS là tạo ra các trang web đẹp, đáp ứng nhanh và thân thiện với người dùng để bạn có thể làm việc trong bất kỳ lĩnh vực nào bạn thích. Dưới đây là một số ý tưởng cho các dự án CSS có thể giúp bạn bắt đầu

  • Một trang mạng xã hội
  • Một hệ thống quản lý nhà hàng
  • Một trò chơi đố vui
  • Một trang web mua sắm trực tuyến
  • Danh mục thiết kế web của bạn
  • một trang blog
  • Một trang web cho một tiệm bánh hoặc cửa hàng rau quả địa phương

Đừng để danh sách này giới hạn các tùy chọn của bạn khi chọn dự án CSS. Nếu bạn có ý tưởng nào khác sẽ giúp bạn có được kinh nghiệm cơ bản và học CSS, hãy tiếp tục và xây dựng nó

Bước 4. Thử nghiệm với phong cách mới

Có rất nhiều tính năng của CSS để khám phá. Do đó, ngay cả khi bạn đã thiết kế một trang web, vẫn có rất nhiều cách để bạn có thể tinh chỉnh các kỹ năng CSS của mình

Một cách hay để thực hành các kỹ năng của bạn và học CSS tốt hơn là xây dựng cùng một trang web bằng các kiểu khác nhau. Hãy thử xem một trang web trông như thế nào với các kích thước phông chữ khác nhau. Thử nghiệm sử dụng các màu khác nhau cho một số đoạn văn bản trên trang web. Xem điều gì sẽ xảy ra khi bạn thay đổi kích thước của hình ảnh

Những thay đổi này sẽ giúp bạn tinh chỉnh ý thức thiết kế tốt của mình. Đồng thời, bạn sẽ có thể thử nghiệm các khái niệm và thuộc tính CSS mới

Vẻ đẹp của CSS nằm ở sự sáng tạo của nó. Một trang mạng xã hội sẽ không bao giờ giống với một trang khác vì có quá nhiều cách để bạn có thể tùy chỉnh một trang. Trang web xuất hiện như thế nào thực sự phụ thuộc vào bạn—bạn là giám đốc sáng tạo khi học cách viết mã CSS

Bước 5. Hỗ trợ trình duyệt chính

Thật không may, các trình duyệt không phải lúc nào cũng nhìn thấy một biểu định kiểu theo cùng một cách. Điều này là do các trình duyệt đã thay đổi quá nhiều trong những năm qua khiến một số trình duyệt không thể theo kịp các thay đổi. Các phiên bản Internet Explorer cũ có thể không xem được trang web giống như phiên bản Chrome mới nhất

Bạn nên bắt đầu nghiên cứu cách tạo trang web hoạt động trên nhiều trình duyệt. Tất cả các trang web tốt nhất đều hoạt động, bất kể trình duyệt của bạn là gì, trong lý do. Đó là một kỹ năng tuyệt vời để biết cách viết mã CSS xuất hiện tốt trên bất kỳ trình duyệt nào

Để nắm vững hỗ trợ trình duyệt, hãy xem các tài nguyên sau

  • Hướng dẫn BrowserStack
  • Hướng dẫn LambdaTest
  • Hướng dẫn W3Schools
  • Hướng dẫn về Net Ninja
  • Khóa học thạc sĩ Frontend

Bước 6. Tham gia cộng đồng nhà phát triển

Khi bạn đang học cách viết mã, bạn có thể muốn viết mã một cách cô lập. Điều này có nghĩa là bạn sẽ dành thời gian viết mã, nhưng bạn không được chia sẻ công việc của mình với người khác. Đây là một lỗi phổ biến của những người mới bắt đầu học CSS

Có hàng trăm nghìn người ngoài kia biết cách viết mã bằng CSS. Các lập trình viên web thường tham gia các cộng đồng lập trình viên, nơi tập hợp các lập trình viên từ người mới bắt đầu đến chuyên gia. Cộng đồng CSS là nơi tuyệt vời để gặp gỡ các nhà phát triển mới mà bạn có thể trò chuyện. Họ cung cấp cho bạn một nơi mà bạn có thể tìm kiếm phản hồi và nhận trợ giúp nếu và khi bạn cần

Có rất nhiều cách để bạn có thể đóng góp cho cộng đồng CSS. Bạn có thể trợ giúp người dùng hiện tại bằng câu hỏi của họ hoặc bạn có thể đăng câu hỏi của riêng mình và bắt đầu thảo luận. Hoặc bạn chỉ có thể trả lời bằng một nhận xét về chủ đề mà bạn thấy thú vị. Bất cứ điều gì bạn làm sẽ giúp cộng đồng CSS phát triển

Dưới đây là một số cộng đồng CSS tốt cho nhà phát triển

  • nhà phát triển. đến. Một cộng đồng các nhà phát triển phần mềm giúp đỡ lẫn nhau. nhà phát triển. có các kênh dành riêng cho nhà phát triển CSS và thiết kế web mà bạn có thể sử dụng để trò chuyện với những người khác đang học CSS
  • tràn ngăn xếp. Một cộng đồng các nhà phát triển hỏi và trả lời câu hỏi
  • GitHub. Một cộng đồng để chia sẻ mã của bạn và cộng tác trên các dự án CSS với những người khác

Bước 7. Thực hành kỹ năng của bạn

Giống như bất kỳ ngôn ngữ lập trình nào, học viết mã CSS là một kỹ năng. Cách tốt nhất để cải thiện là thực hành CSS càng nhiều càng tốt. Bạn càng dành nhiều thời gian để suy nghĩ về CSS, bạn càng có nhiều thông tin chi tiết hơn

Có rất nhiều cách để bạn có thể thực hành CSS nên không có lý do gì để không làm như vậy. Dưới đây là một số ý tưởng giúp bạn thực hành CSS

  • Sử dụng Codepen. Tìm phong cách bạn thích trên Codepen và cố gắng làm cho nó tốt hơn
  • Tham gia thử thách trên Codecademy. Làm theo hướng dẫn trên một trang web như Codecademy, sau đó thực hiện các cải tiến của riêng bạn
  • Giúp đỡ mọi người trong một cộng đồng. Tìm một chủ đề trên Dev. hoặc Stack Overflow mà bạn thấy thú vị và cố gắng giúp đỡ các thành viên khác trong cộng đồng

Khái niệm cơ bản về CSS. Nắm vững các nguyên tắc cơ bản về CSS

Nếu bạn muốn học CSS, trước tiên bạn cần nắm vững các kiến ​​thức cơ bản về CSS. Để làm như vậy, có những chủ đề CSS cụ thể mà bạn nên tập trung vào. Khám phá cách học CSS và yếu tố cốt lõi nào là quan trọng nhất bên dưới

Bộ chọn và cú pháp CSS

Điều đầu tiên, bạn cần biết cú pháp của CSS. Các quy tắc cơ bản này chi phối tất cả các kiểu bạn sẽ viết khi sử dụng ngôn ngữ lập trình CSS. Khi mới bắt đầu, bạn cũng cần tìm hiểu vị trí và cách viết các quy tắc CSS

Tiếp theo, bạn có thể khám phá các lớp CSS và bộ chọn. Bộ chọn được sử dụng để xác định phần tử nào trên trang web sẽ được tạo kiểu bằng các quy tắc bạn đã viết. Dưới đây là một số chủ đề bạn nên đề cập khi nói đến cú pháp và bộ chọn CSS

  • Cách viết quy tắc kiểu CSS
  • CSS nội tuyến, bên ngoài và bên trong
  • Thẻ, lớp và ID
  • Khái niệm cơ bản về bộ chọn
  • Chuỗi bộ chọn và các phần tử lồng nhau
  • Sử dụng nhiều bộ chọn
  • tính đặc hiệu của CSS

Mô hình hộp

Như chúng tôi đã đề cập trước đó, HTML được sử dụng để xác định cấu trúc của trang web. Tuy nhiên, HTML sử dụng một tập hợp các giá trị mặc định để tạo cấu trúc của một trang web. Nếu bạn muốn tùy chỉnh cách các phần tử xuất hiện, bạn cần sử dụng mô hình hộp CSS

Mô hình hộp là một tập hợp các thuộc tính xác định phần nào của phần tử sử dụng hết dung lượng trên trang web. Mô hình hộp xác định đường viền, đường viền và khoảng trống bên trong và bên ngoài của một phần tử. Dưới đây là các thành phần chính của mô hình hộp mà bạn sẽ cần tìm hiểu

  • khu vực nội dung
  • khu vực đệm
  • vùng biên giới
  • vùng biên

Thuật ngữ CSS , chẳng hạn như chiều cao dòng và kích thước hộp

phần tử hiển thị

HTML hiển thị các phần tử từ trái sang phải và từ trên xuống dưới. Tuy nhiên, bạn có thể muốn các phần tử xuất hiện ở vị trí nhất định. Ví dụ, có thể bạn muốn một hộp xuất hiện ở góc dưới cùng bên trái của trang web của mình

Đó là nơi hiển thị phần tử xuất hiện. Các nguyên tắc hiển thị phần tử hướng dẫn trình duyệt về nơi hiển thị một phần tử nhất định trên trang web. Dưới đây là những chủ đề chính bạn nên tìm hiểu về lĩnh vực này

  • Các cú pháp CSS, chẳng hạn như inline-grid, inline-block và inline flow
  • Giá trị được nhóm
  • Hộp giả và hộp con
  • Cách xóa các phần tử khỏi cây trợ năng
  • Danh sách sản phẩm

Màu sắc và Phông chữ

Màu sắc và phông chữ là hai cách mà bạn có thể làm cho trang web trông đẹp mắt hơn về mặt thẩm mỹ. Chúng được coi là cần thiết trong nhiều hướng dẫn về phong cách trang web

CSS cung cấp một số thuộc tính mà bạn có thể sử dụng để kiểm soát màu sắc của các thành phần trên trang web cũng như cách văn bản xuất hiện. Dưới đây là một số chủ đề bạn nên tìm hiểu khi nói đến màu sắc và phông chữ CSS

  • Màu nền và màu nền trước
  • Màu thập lục phân, RGB và HSL
  • độ mờ CSS
  • kiểu chữ CSS
  • Họ phông chữ, kiểu phông chữ và trọng lượng phông chữ
  • Giãn cách chữ, chiều cao dòng và căn chỉnh văn bản
  • Sử dụng phông chữ bên ngoài

lưới

Lưới cho phép các nhà phát triển định vị các phần tử một cách dễ dàng và hiệu quả trên trang web. Bố cục CSS dạng lưới sử dụng các cột và hàng để cho phép các nhà phát triển thiết kế trang web mà không cần sử dụng số float và định vị

Dưới đây là các chủ đề chính bạn sẽ muốn đề cập đến để làm chủ lưới CSS

  • Cấu trúc lưới CSS
  • Lưới cột và hàng
  • Tạo cột và hàng
  • Khoảng cách lưới và đường lưới
  • Các mục và khu vực lưới

Bạn cũng có thể muốn dành thời gian tìm hiểu về flexbox. Flexbox là một công nghệ khác được sử dụng để định vị các thành phần trên trang web

Cách học CSS miễn phí

Nếu bạn muốn học CSS miễn phí, có rất nhiều tài nguyên khác nhau mà bạn có thể truy cập. Mặc dù CSS là một chủ đề kỹ thuật, nhưng bạn không cần phải tốn thêm chi phí để học cách viết mã CSS. Có các hướng dẫn, khóa học và hướng dẫn bằng văn bản trực tuyến có thể giúp bạn học CSS miễn phí. Khám phá một số tài nguyên tốt nhất có thể giúp bạn học CSS miễn phí bên dưới

  • Tìm hiểu CSS bởi Google Developers. Đây là một hướng dẫn miễn phí được biên soạn bởi Google. Nó bao gồm các chủ đề CSS khác nhau từ mô hình hộp đến kiểu chữ và cung cấp các bài học dưới dạng podcast, ảnh, ví dụ mã hóa, v.v.
  • Giới thiệu về HTML và CSS của Team Treehouse. Đây là khóa học dài 134 phút dạy học sinh cách sử dụng HTML và CSS để xây dựng trang web. Nó được trình bày dưới dạng các bài học video được trình bày bởi một người hướng dẫn
  • Hướng dẫn CSS của W3Schools. Hướng dẫn này cung cấp một hướng dẫn đầy đủ để học CSS. Nó cung cấp các ví dụ mã hóa và câu đố để bạn có thể kiểm tra sự hiểu biết của mình về các chủ đề
  • Giới thiệu về CSS trên Scrimba. Đây là khóa học kéo dài một giờ bao gồm tất cả các thành phần thiết yếu của CSS. Nó nhằm vào những sinh viên đã có hiểu biết cơ bản về HTML
  • Phát triển web bằng cách làm. HTML / CSS từ đầu trên Udemy. Khóa học này dạy cho sinh viên cách xây dựng một trang web từ đầu. Nó bao gồm cả CSS và CSS3 cũng như HTML và HTML5

Cách tốt nhất để học CSS trực tuyến

Bây giờ bạn biết những gì bạn cần biết để viết mã trong CSS, bạn có thể hỏi. Tôi có thể tìm hiểu về những chủ đề này ở đâu?

Các tài nguyên mà bạn sử dụng cuối cùng sẽ phụ thuộc vào cách học của bạn. Vì vậy, trước khi bạn bắt đầu tìm kiếm tài nguyên, hãy tự hỏi mình. Làm thế nào để tôi học tốt nhất?

Bạn thậm chí có thể muốn thử một vài định dạng khác nhau để tìm ra cách học CSS tốt nhất. Sau đó, khi bạn đã tìm thấy một tài nguyên, bạn có thể tập trung sự chú ý của mình vào các tài nguyên sử dụng định dạng học tập mà bạn cảm thấy thoải mái nhất

Đối với hầu hết người mới bắt đầu, các khóa học và hướng dẫn tương tác nói chung là cách tốt nhất để học CSS, vì chúng cho phép bạn xây dựng thứ gì đó trong khi học. Điều này đặc biệt quan trọng trong CSS vì ngôn ngữ này là về hình ảnh và phong cách. Khám phá các tài nguyên có thể giúp bạn tìm hiểu CSS bên dưới

Khóa học CSS trực tuyến

Học CSS bằng Codecademy

  • Trị giá. Miễn phí
  • Khán giả. người mới bắt đầu

Hơn 490.000 người đã đăng ký khóa học này vì đây là một trong những cách tốt nhất để học CSS. Khóa học CSS trực tuyến kéo dài 20 giờ này sẽ dạy bạn về bộ chọn, mô hình hộp, màu sắc, kiểu chữ, v.v.

Giới thiệu về HTML/CSS của Khan Academy

  • Trị giá. Miễn phí
  • Khán giả. người mới bắt đầu

Khóa học trực tuyến miễn phí này là phần giới thiệu tuyệt vời về HTML và CSS. Bạn sẽ bắt đầu bằng cách tìm hiểu về cấu trúc của một trang web. Đây là một trong những khóa học CSS tốt nhất để tìm hiểu về các chủ đề như sử dụng CSS để tạo kiểu trang và thuộc tính văn bản CSS. Đến cuối khóa học, bạn sẽ thảo luận về bố cục trang và bộ chọn CSS nâng cao

Giới thiệu về HTML và CSS của Udacity

  • Trị giá. Miễn phí
  • Khán giả. người mới bắt đầu

Khóa học CSS trực tuyến theo nhịp độ riêng này lý tưởng cho bất kỳ ai muốn tìm hiểu kiến ​​thức cơ bản về HTML và CSS. Bạn sẽ đề cập đến các chủ đề như cấu trúc của tài liệu HTML, cú pháp CSS, bộ chọn và cách sử dụng các công cụ dành cho nhà phát triển trình duyệt

Sách CSS trực tuyến

HTML và CSS. Thiết kế và xây dựng trang web của Jon Duckett

Đây là một trong những cuốn sách CSS hay nhất vì nó giới thiệu đầy đủ về cách xây dựng trang web bằng HTML và CSS. Bạn sẽ tìm hiểu kiến ​​thức cơ bản về các công nghệ này và cách chúng hoạt động cùng nhau

Cuốn sách này đi kèm với rất nhiều ví dụ và đồ họa để giúp bạn hình dung các chủ đề bạn học

Học thiết kế web của Jennifer Niederst Robbins

Cuốn sách CSS này bắt đầu từ hình vuông. Đây là một bài đọc tốt cho bất kỳ ai mới bắt đầu phát triển web. Bạn sẽ bắt đầu bằng cách xây dựng các trang HTML cơ bản. Sau đó, bạn sẽ tiếp tục thảo luận về cách sử dụng CSS cho màu sắc, định dạng văn bản và bố cục. Đến cuối cuốn sách, bạn sẽ đề cập đến các chủ đề phát triển web có liên quan khác như JavaScript là gì và cách bạn có thể sử dụng nó trong các trang web của mình.

CSS. Hướng dẫn dứt khoát của Eric Meyer và Estelle Weyl

Cuốn sách này là những gì nó nói trên trang bìa. đó là hướng dẫn đầy đủ về CSS. Đây là một trong những cuốn sách CSS hay nhất bởi vì, không giống như nhiều cuốn sách khác, nó chỉ tập trung vào CSS. Bạn sẽ tìm hiểu về màu CSS, giá trị, bộ chọn, bố cục hộp, v.v.

Tài nguyên CSS trực tuyến

Tìm hiểu cách tạo kiểu HTML bằng CSS của Mozilla

Mozilla, người tạo ra Trình duyệt web Mozilla, là một trong những tài nguyên học tập CSS tốt nhất vì nó cung cấp hướng dẫn đầy đủ về cách thêm CSS vào trang web. Hướng dẫn trực tuyến này bao gồm cú pháp CSS cơ bản, các khối xây dựng của CSS, cách định kiểu văn bản và bố cục trang

MãBút

CodePen là một sân chơi học tập trực tuyến để phát triển web. Công cụ này giúp bạn dễ dàng thử nghiệm các thiết kế web sáng tạo. Bạn sẽ tìm thấy hàng nghìn phong cách được viết bởi những nhà phát triển mới bắt đầu và chuyên gia mà bạn có thể xem để lấy cảm hứng. Đây là một trong những tài nguyên CSS tốt nhất để thực hành và học CSS

Hướng dẫn nghề nghiệp CSS

Career Karma có hàng chục hướng dẫn trực tuyến và tài nguyên học CSS. Mỗi hướng dẫn đi kèm với các đoạn mã để giúp bạn nắm vững một chủ đề cùng với phần giải thích về các đoạn mã đó. Thư viện của chúng tôi bao gồm mọi thứ từ bộ chọn đến kiểu nội tuyến

Bạn có nên học CSS?

Có, bạn nên học CSS. Con đường học CSS của bạn sẽ đầy thăng trầm. Về lâu dài, biết cách viết mã trong CSS có thể mở ra cho bạn nhiều cơ hội. Học CSS có thể giúp bạn trở thành nhà thiết kế web hoặc nhà phát triển web. Điều này thật tuyệt nếu bạn nghĩ rằng một bước chuyển nghề nghiệp là dành cho bạn trong tương lai

Khi bắt đầu học CSS, bạn nên tập trung vào các nguyên tắc cơ bản như cú pháp, bộ chọn, mô hình hộp, định vị và các chủ đề cơ bản khác. Sau đó, khi bạn đã sẵn sàng, bạn có thể tiếp tục khám phá các kiểu nâng cao hơn mà bạn có thể sử dụng để tạo các thiết kế phức tạp hơn nữa

CSS là một kỹ năng vô cùng hữu ích để bạn học hỏi. Mặc dù có thể khó bắt đầu, nhưng bạn sẽ có thể thành thạo kỹ năng này giống như tất cả các nhà phát triển biết CSS khác đã làm. Đó chỉ là vấn đề làm việc chăm chỉ và luyện tập

Tìm hiểu câu hỏi thường gặp về CSS

CSS có dễ học không?

Có, CSS rất dễ học. Bạn có thể học CSS chỉ trong vài tuần vì đây là ngôn ngữ lập trình tương đối đơn giản. Mặc dù bạn sẽ vẫn phải nắm vững các khía cạnh kỹ thuật của mã hóa để học CSS, nhưng nó dễ học hơn các ngôn ngữ khác


Tôi nên học HTML hay CSS trước?

Bạn nên học HTML trước khi học CSS. CSS giúp bạn thay đổi giao diện trang web bạn tạo bằng HTML. Như vậy, hiểu cách viết mã và sử dụng HTML sẽ giúp bạn học CSS dễ dàng hơn nhiều


Học HTML và CSS có đáng không?

Vâng, học HTML và CSS rất đáng giá nếu bạn muốn làm việc trong lĩnh vực phát triển web. Nếu bạn học CSS và HTML, bạn sẽ có thể xây dựng trang web của riêng mình với các tính năng thẩm mỹ hấp dẫn. Ngoài ra, những kỹ năng này trông tuyệt vời trong sơ yếu lý lịch và cho phép bạn ứng tuyển vào các vị trí phát triển web khác nhau


Tôi có thể học CSS ở đâu?

Bạn có thể học CSS thông qua các tài nguyên trực tuyến như hướng dẫn, khóa học và video hướng dẫn. Một nơi khác mà bạn có thể học CSS là mã hóa bootcamp. Bootcamp CSS là các khóa học chuyên sâu giúp bạn học CSS và phát triển các kỹ năng chuyên nghiệp chỉ trong vài tháng

Tôi có thể tự học CSS không?

Là một nhà phát triển tự học, đây là câu chuyện của tôi về cách tôi học CSS. Tiêu đề có thể hơi in đậm nhưng tôi ước mình đã biết về phương pháp học CSS được đưa ra trong bài viết này khi tôi mới bắt đầu. Tôi hy vọng kinh nghiệm của tôi sẽ giúp bạn đẩy nhanh quá trình học tập

CSS có khó hơn C++ không?

C++ là ngôn ngữ lập trình dùng để làm phần mềm máy tính. Css dễ hơn nhiều so với C++ . CSS khác với C++, CSS dùng để tạo style cho web.

Tôi có thể học CSS trong 2 tuần không?

Bạn có thể mất 1-2 tuần để hoàn thành khóa học và khoảng một tháng thực hành để làm quen với HTML và CSS. Điều quan trọng là áp dụng các dự án học tập và xây dựng của bạn. Dự án đơn giản nhất bạn có thể tạo là trang web cá nhân của riêng bạn.

Tôi có thể học CSS trong 2 tháng không?

CSS là yếu tố chính của sự phát triển web hiện đại. Bạn nhất định phải học nó để trở thành Frontend dev. Bạn sẽ mất khoảng 2-3 tuần để học CSS và 1-2 tháng thực hành để thành thạo CSS . Bạn sẽ nắm bắt được CSS trong bao lâu tùy thuộc vào số giờ mỗi ngày bạn sẵn sàng dành.