Selector thuộc tính trong CSS

Có rất nhiều kiểu Selector khác nhau trong CSS, với tôi Selector thuộc tính là cái vô cùng thú vị. Bởi vì khi mới học bạn sẽ thấy mình ít dùng nó, nhưng khi học nâng cao hơn thì ngược lại và đôi khi nhờ nó bạn đỡ tốn thời gian tạo id hoặc class mới.

Code mẫu

CSS:

[type=”text”] {background-color:yellow;}
HTML:
<form>
<label>Họ và tên</label><input type=”text”><br>
<label>Email</label><input type=”email”>
</form>
Kết quả:

Cách dùng

Về cơ bản ý tưởng về selector thuộc tính rất đơn giản, thay vì dùng id hay class để xác định đối tượng cần tác động, chúng ta dùng ngay các thuộc tính của đối tượng đó để định danh.

Các ví dụ khác

HTML:
<a href=”http://www.ducanhplus.com” title=”Nguyễn Đức Anh”><img src=”images/ducanh.jpg”></a>
CSS:
[title=”Nguyễn Đức Anh”] {margin-left:20%;}

Kết quả:

Tôi là Nguyễn Đức Anh, sinh năm 1987. Hiện là marketing tự do. Theo dõi tôi trên Facebook để nhận thông tin cập nhật về blog này:

Trả lời

Thư điện tử của bạn sẽ không được hiển thị công khai.