Khi nói về lập trình web không thể không nhắc đến HTML và CSS. Đây là 2 ngôn ngữ căn bản dành cho những người mới bắt đầu làm quen về thiết kế website.

Bạn sẽ không thể tạo nên một trang web hoàn chỉnh nếu không biết về CSS. Chính vì thế bài viết sau đây sẽ giúp bạn tìm hiểu sâu hơn về CSS.

CSS là gì? Hướng dẫn cách học CSS hiệu quả

Ngôn ngữ CSS là gì

CSS là viết tắt của Cascading Style Sheet trong tiếng Anh. Nó được dùng để thay đổi cách hiển thị cho HTML.

CSS được phát triển bởi W3C (World Wide Web Consortium) vào năm 1996.

Bạn hãy tưởng tượng HTML giống như một ngôi mới xây xong chỉ có tường và gạch còn CSS giống như một lớp sơn trang trí cho ngôi nhà trông đẹp hơn.

Đây là ngôn ngữ Frond-end khá dễ học. Không hề khó như ngôn ngữ lập trình Back-end như PHP.

Cấu trúc của CSS

Các phần tử CSS sẽ được nằm trong cặp thẻ <style>…</style>

Ví dụ:

<style>
p { color: #121212; }
</style>

Lợi ích

Như đã nói ở trên CSS giúp bạn xây dựng giao diện website trông đẹp bắt mắt và thân thiện với người dùng hơn.

Khi bạn học được nó hoàn toàn có thể tuỳ biến một trang web theo ý thích của mình.

Cách sử dụng

Có 3 kiểu sử dụng đó là:

Inline CSS: 

<div style=”font-weight:bold; text-decoration:underline; color:#333333;”>Đây là đoạn văn bản</div>

Với cách này bạn chèn trực tiếp ngay trên một đối tượng nhất định. Định đạng CSS sẽ được nằm trong style=””.

Internal CSS:

<style type=”text/css”>

body {font-family:Arial; color:#999999;}

</style>

Cách này sẽ đặt trong cặp thẻ <head>…</head> của HTML

External CSS:

<head>

<link rel=”stylesheet” type=”text/css” href=”style.css”/>

</head>

Cách này sẽ gọi một tập tin tên là style.css hoàn toàn tách biệt. Ví dụ:

body {font-family:Arial; color:#333333;}

Với 3 cách trên thì người ta sẽ dùng External CSS khi xây dựng trang web.

Cách học CSS hiệu quả

CSS rất dễ học, nó không cần phải tư duy như JavaScript hay PHP mà đơn giản bạn chỉ cần nhớ và áp dụng đúng cách mà thôi.

Để học được bạn nên tự tay thực hành những gì đã học được, tuyệt đối không copy và paste.

Sử dụng liên tục cho tới khi nó là mặc định trong đầu của bạn.

Chẳng hạn khi nói đến chữ in đậm thì bạn nghĩ ngay đến thẻ <b></b>, in nghiêng là thẻ <i></i>, gạch chân là <u></u> hoặc canh giữa là <center></center>

Hoặc một cách học khác đó là ngay trên trình duyệt Chrome bạn ấn F12 ở góc phải của màn hình bạn sẽ thấy như hình dưới. Hãy đọc và tìm hiểu các phần tử trong đó nhé!

CSS là gì? Cách học CSS hiệu quả

Lời kết: Ngôn ngữ CSS có vai trò quan trọng trong thiết kế website, nó giúp trình bày và trang trí trang web đẹp, hấp dẫn và thân thiện với người dùng.

Nếu bạn đang muốn theo đuổi nghề làm web thì hãy nên bắt đầu học ngay hôm nay.