30/09/2018, 17:16

BEM-Một qui tắc đặt tên class CSS thú vị và hiệu quả

BEM(viết tắc của Block, Element, Modifier) là qui tắc đặt tên thông dụng cho class trong HTML và CSS. Được tạo ra bởi team ở Yandex, mục đích là để giúp các lập trình viên hiểu được mối quan hệ giữa HTML và CSS trong 1 project…

đọc thêm tại: http://blogs.vuilen.party/post/BEM-101/

Khiem Nguyen viết 19:29 ngày 30/09/2018

cảm ơn bạn, nhờ bạn mà bây h mình phải banh cái pet project của mình ra để đặt tên lại cho cái đám bùi nhùi css của mình. Nhiều lúc chẳng biết đặt đên sao cho nó phù hợp giữa css với html. Đặt tiếng Việt thì thấy nó sao sao đó. Còn đặt tiếng Anh thì không diễn tả được hết ý nghĩa của css với html

Võ Hoài Nam viết 19:21 ngày 30/09/2018

Nhớ có lần đọc đâu đó thì họ lại đề nghị dùng dấu gạch nối giữa các từ. Ví dụ: btn-primary, md-button,… Mình thấy một số framework sử dụng cách này.

Cá nhân mình thì thấy đặt theo BEM thì hơi dài cho việc chỉnh sửa CSS hoặc selector bằng JavaScript…

Trang Tuân viết 19:17 ngày 30/09/2018

Cứ mở bootstrap framework ra và đọc code của nó là hiểu được quy tắc này ngay. Còn về khả năng và tính hiệu quả của quy tắc này thì không phải bàn cãi rồi, ai sử dụng bootstrap cũng thấy được sự tiện dụng, rõ ràng và rất dễ custom lại của nó.

null viết 19:29 ngày 30/09/2018

Có lẽ là vì trong CSS có selector cho phần gạch nối.

Võ Hoài Nam viết 19:31 ngày 30/09/2018

Có lần mình đọc ở đâu đó… nói là class hoặc ID nên cách nhau bằng dấu gạch nối… không dùng ID để làm selector cho CSS.

null viết 19:30 ngày 30/09/2018

Sublime text thì cài cssLint, nó nhắc suốt ngày luôn

Duc Nguyen viết 19:22 ngày 30/09/2018

Theo ý kiến của mình thì nên kết hợp với google code guide line

http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml

mình không thích kiểu (hai gạch ngang) hoặc __(hai gạch dưới) mà nên chỉ là -(một gạch ngang)

Võ Hoài Nam viết 19:26 ngày 30/09/2018

bạn cài thêm cái Twitter Recess… lúc nó quét là sẽ nhắc bạn phải đặt thứ tự margin, padding, color,… sao cho đúng nữa kìa

Bài liên quan
0