Hãy đăng ký thành viên để có thể dễ dàng trao đổi, giao lưu và chia sẻ về kiến thức đồ họa.
  1. Hãy đăng ký subscribe kênh Youtube mới của Việt Designer tại địa chỉ: Youtube.com/VietDesignerChannel để theo dõi các video về thiết kế đồ họa. Do trước đó kênh cũ bị Youtube quét không rõ lý do, trong thời gian chờ kháng cáo nếu các bạn thấy video trên diễn đàn bị die không xem được thì có thể vào kênh mới để tìm xem video sơ cua nhé.
    Loại bỏ thông báo

Tính năng của !important trong CSS, sử dụng nó như thế nào?

Chủ đề thuộc danh mục 'HTML - CSS - JS - PHP - ASP' được đăng bởi Phạm Hữu Dư, 16/10/13.

Lượt xem: 11,118

  1. Phạm Hữu Dư phamhuudu.com

    ! important được sử dụng để thay đổi thứ tự ưu tiên của CSS, khi một quy luật nào đó được gán important thì nó sẽ có mức ưu tiên cao nhất, cho dù thành phần đó có khai báo CSS cục bộ hay CSS nội tuyến.

    [​IMG]

    Xét ví dụ sau:

    Giả sử ta có thành phần p được khai báo CSS cục bộ như sau:
    Code:
    <p class="first" style="color: red">Đoạn văn bản bị ảnh hưởng bởi các quy luật của 
    	
    CSS</p>
    Và bạn khai báo CSS ngoại tuyến như sau:
    Code:
    p.first{ color: green }
    Thì đoạn văn bản trên luôn luôn được hiển thị với màu đỏ bởi vì được khai báo CSS cục bộ.

    Sử dụng important để thay đổi thứ tự ưu tiên trong CSS

    Vậy có cách nào để đoạn văn bản trên được hiển thị với màu xanh mà không phải chỉnh sửa CSS cục bộ, đó là lúc bạn cần sử dụng đến important.

    Chỉnh sử lại đoạn mã trong CSS ngoại tuyến lại như sau:
    Code:
    p.first{ color: green !
    	
    important }
    Kết quả là đoạn văn bản trên được hiển thị với màu xanh trong khi CSS cục bộ vẫn được khai báo là style=”color: red”

    Như vậy khi thêm vào ! important phía sau một quy luật CSS, chúng ta có thể dễ dàng thay đổi thứ tự ưu tiên trong CSS.

    Important không chỉ thay đổi thứ tự ưu tiên giữa CSS cục bộ, CSS nội tuyến, CSS ngoại tuyến, mà còn thay đổi thứ tự ưu tiên ngay trong file CSS

    Giả sử khi ta khai báo CSS như sau:
    Code:
    p.second{ color: blue }
    p.second{ color: red }
    Thì quy luật được khai báo sau sẽ được ưu tiên hơn quy luật khai báo trước, như ví dụ trên thì đoạn văn bản p.second sẽ được hiển thị với màu đỏ. Nhưng bạn vẫn có thể định dạng đoạn văn bản hiển thị với màu xanh bằng việc thêm ! important sau quy luật thứ nhất
    Code:
    p.second{ color: blue !
    	
    important }
    p.second{ color: red }
    Trường hợp này xảy ra khi trong ứng dụng của bạn có nhiều file . css dẫn đến tình trạng khó kiểm xoát, và khi đó bạn cần sử dụng đến ! important để quyết định quy luật nào sẽ được hiển thị.

    Lời khuyên cho bạn: Nên gộp chung tất các các file . css thành một file duy nhất để tiện quản lý và dễ tối ưu.

    Nguồn: ewebvn.com

    ...
    cdt_nt, Emerald, Hello Stranger2 người khác thích bài viết này.
  2. quang_minh64

    quang_minh64 Thành viên cấp 1

    mình hiểu nôm na là nếu các css giống nhau, cái nào viết dưới cùng vì cái đó dc ưu tiên hiển thị, còn cái nào có ! important thì dc ưu tiên hơn tấc cả! hihi chỉ hình dung nôm na vậy mà xài tới thôi. mình hok dc hoc bài bản chỉ nghịch css từ khi blog 360 plus ra đời
    Phạm Hữu Dư thích bài viết này

Ủng hộ diễn đàn