正確使用「混入」少

我想創建簡單的「模板」使用較少但我想我可能會這樣做不正確的..正確使用「混入」少

這裏是我打算：

<div class='box'>content</div>

和.LESS文件：

//this is the mixin 

.blueBoxNotificationDiv { 
    text-decoration: none !important; 
    position: absolute; 
    background: #EBEBEB; 
    width: 100%; 
    border-top: 1px solid #999; 
    bottom: 0; 
    height: 21px; 
}

現在讓我們說，我想將此「混入」到div「.box的」。這是怎麼了，我會它寫在.LESS：

.box { 
    .blueBoxNotificationDiv; 
}

什麼是去了解這個正確的方法是什麼？

來源

2012-05-29 captainrad

這對我來說看起來是正確的。你到目前爲止沒有工作或什麼？你有沒有嘗試用你發佈的語法來使用mixin？ – Bojangles

正確.. mixin不會對div應用任何東西。 – captainrad

確保mixin類位於LESS中的'.box'聲明之上。此外，看看Chrome的檢查器/ Firebug，看看是否有任何樣式被覆蓋。 – Bojangles

如果沒有正確寫出（包括規則），那麼LESS變量將會阻止其他文件中的任何內容被讀取。問題的

例子：

@color1: #000000; 
@color2: #ffffff; 
@color3: ##e6e6e6; 

.container { 
    color:@color1; 
} 

.....etc

這應該是很明顯的，但小錯誤可以很容易錯過..變量「@ COLOR3」有兩個hashs「##」。如果你不調用這個變量，並且下面的代碼都不會被讀取，那麼這將會減少偶數（接近我所知道的）。問題解決了！

來源

2012-05-29 22:49:18 captainrad

你可以從OP中的代碼給出一個例子嗎？我很想知道究竟是什麼造成了這個問題。 – Bojangles

我沒有在我的OP中包含我所有的代碼，看看我上面編輯的答案。這是一個小錯誤，但很明顯會造成問題！感謝您的幫助btw！ – captainrad

我經常想知道爲什麼我的網頁上有一半的樣式中斷了，然後我找到了一個缺失的分號，它全部重新運行！應該有一種更簡單的方法來驗證CSS（W3C驗證程序很難快速完成），甚至是一個LESS驗證程序。 – Bojangles

正確使用「混入」少

回答

相關問題