**PHƯƠNG PHÁP ĐẶT TÊN CLASS THEO BEM CSS** --- BEM là viết tắt của Block, Element, Modifier, là một phương pháp đặt tên lớp trong CSS được sử dụng để xây dựng các phần tử HTML và quản lý kiểu dáng của chúng. Cụ thể, BEM đặt tên cho các lớp CSS của các phần tử HTML bằng cách sử dụng các tiền tố và phân cách, giúp cho việc quản lý và sửa lỗi trở nên dễ dàng hơn. * Block: là một phần tử độc lập trong trang web, có thể chứa các phần tử khác bên trong nó. * Element: là một phần của Block, không thể tồn tại độc lập và được đặt tên bằng cách thêm tiền tố Block__ vào trước tên của phần tử. * Modifier: là một trạng thái hoặc biến thể của Block hoặc Element, được đặt tên bằng cách thêm tiền tố Block-- hoặc Element-- vào trước tên của lớp CSS. VD: ![](https://i.imgur.com/9XaTTJD.png) Đoạn mã trên có đúng với quy tắc đặt tên CSS BEM: * Block được đặt tên là "content". * Element của Block "content" gồm "title" và "paragraph" được đặt tên là "content__title" và "content__paragraph" tương ứng. * Element của Block "content__map" được đặt tên là "content__map__title" và "content__map__button" tương ứng. * Modifier được áp dụng cho Block "content__map" được đặt tên là "content__map--red". * Modifier được áp dụng cho Element "content__map__title" được đặt tên là "content__map__title--blue". * Modifier được áp dụng cho Element "content__map__button__text" được đặt tên là "content__map__button__text--green". * Tất cả các tên lớp đều được đặt theo quy tắc đặt tên BEM và cách đặt tên này giúp cho việc quản lý và phát triển mã CSS dễ dàng hơn.