Ghi đè ít mixin

Question

Tôi muốn xóa border radius khỏi tất cả các phần tử trong Bootstrap. Vì vậy, tôi đã tạo custom-mixins.less và đặt các dòng sau vào trong đó, nhảy lên nó sẽ ghi đè lên bản mix gốc .border-radius nhưng không.

// Border Radius 
.border-radius(@radius) {  
} 

Vì vậy, tôi đã thử các dòng sau làm phương án thay thế.

// Border Radius 
.border-radius(@radius) { 
    @radius : 0px; 
    -webkit-border-radius: @radius; 
    -moz-border-radius: @radius; 
      border-radius: @radius; 
} 

Tôi đã thử một số mixin tại http://less2css.org. Có vẻ như ít thay vì ghi đè lên các mixin, gắn thêm tất cả các thuộc tính từ mixin sau vào bản gốc. Có bất kỳ giải pháp sạch hơn và dễ dàng hơn cho điều này?

Answer 1

Ít hoạt động chính xác như CSS ở khía cạnh này. Ví dụ: nếu bạn đã viết CSS này:

p { border: 1px solid black; } 

Nó sẽ cung cấp cho tất cả các đoạn một viền đen. Nếu sau này trong tài liệu bạn đã thêm:

p { } 

Bạn sẽ không mong đợi ghi đè định nghĩa trước đó, phải không?

Vì vậy, trong trường hợp này, đó là hành vi mong đợi, bạn cần phải ghi đè cụ thể các giá trị CSS bạn muốn ghi đè.

Answer 2

Bắt đầu từ lesscss 1.7.0, điều này sẽ có thể bằng cách sử dụng "rulesets tách ra", nhưng không may, ngay cả với 1.7.5 tôi nhận được "ParseError: đầu vào không được nhận" khi tôi cố gắng sử dụng các cú pháp ruleset tách

http://lesscss.org/features/#detached-rulesets-feature

[EDIT]: Tôi đã nhận lỗi phân tích vì tôi đã bỏ dấu chấm phẩy sau định nghĩa ruleset, nhưng nó hoạt động tốt - ruleset không có tham số, nó thực sự là một biến, do đó định nghĩa của nó có thể bị ghi đè

Answer 3

Nếu bạn đang nhập các tệp Bootstrap ít hơn vào dự án của mình thì bạn có thể thử chỉnh sửa/ghi đè lên các biến radius phần Bootstrap:

@border-radius-base: 0px; 
@border-radius-small: 0px; 
@border-radius-large: 0px; 

nếu không thì bạn có thể biên dịch lại và tải về Bootstrap thiết 0px giá trị cho các biến mã CSS trong http://getbootstrap.com/customize/