2013-06-14 15 views
6

Chcę usunąć border radius ze wszystkich elementów w Bootstrap. Stworzyłem więc custom-mixins.less i umieściłem w nim następujące wiersze, przeskakując, że nadpisze oryginalną mieszankę .border-radius, ale tak się nie stało.Zastąp mniej mixin

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

Próbowałem więc użyć linii jako alternatywy, która faktycznie zadziałała.

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

Próbowałem kilka wstawek w http://less2css.org. Wydaje się, że mniej zamiast nadpisywania mixin, dołącza wszystkie właściwości z późniejszego mixinu do oryginalnego. Czy istnieje jakieś czystsze i łatwiejsze rozwiązanie tego?

Odpowiedz

10

Mniej działa dokładnie tak, jak CSS w tym zakresie. Na przykład, jeśli został napisany ten kod CSS:

p { border: 1px solid black; } 

Daje to wszystkim akapitom czarne obramowanie. Jeśli później w dodanym dokumencie:

p { } 

Nie spodziewałbyś się, że nadpisze poprzednią definicję, prawda?

Tak więc, w tym przypadku jest to oczekiwane zachowanie, należy szczególnie nadpisać wartości CSS, które mają zostać nadpisane.

+2

+1 - To jest dokładnie poprawne. Jako [site states] (http://www.lesscss.org/#-mixins), "Prawidłowe jest definiowanie wielu mixin o tej samej nazwie i liczbie parametrów, a less użyje właściwości wszystkich, które mogą mieć zastosowanie", co jest zasadniczo tym, co stwierdzono w Twojej odpowiedzi. – ScottS

+1

Byłoby świetnie, gdybyśmy mogli nadpisać mixiny tak, jak moglibyśmy zrobić z mniejszą ilością zmiennych. A ty za pomoc @nerdburn –

+0

I @ScottS też –

1

Począwszy od lesscss 1.7.0, powinno to być możliwe za pomocą „wolnostojący zestawów reguł”, ale niestety, nawet z 1.7.5 otrzymuję „ParseError: wejście Nierozpoznany”, gdy próbuję użyć składni wolnostojący zestaw reguł

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

[EDIT]: mam błąd składniowy bo upuścił średnika po definicji zestawu reguł, ale to działa dobrze - zestaw reguł nie posiada parametrów, w rzeczywistości jest to zmienna, więc jest to definicja może być nadpisane

+0

Cóż, pytanie zakładało, że nie możesz lub nie chcesz modyfikować oryginalnej definicji mixin. W przeciwnym razie zamiast przesłonić, możesz go po prostu edytować lub użyć opcji [default] (http://lesscss.org/functions/#misc-functions-default) guard (co jest nieco bardziej użytecznym sposobem na nadpisanie mixin w porównaniu do "zestaw reguł w zmiennej", szczególnie jeśli mixin jest parametryczny). –

0

Jeśli importujesz Bootstrap, mniej plików w projekcie, możesz spróbować edit/nadpisać Bootstrap zmienne promień komponent:

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

jeśli nie to można skompilować i pobierz Bootstrap kod CSS ustawienia 0px wartości do tych zmiennych w http://getbootstrap.com/customize/