自動處理供應商前綴的CSS框架？

我看過藍圖，更少和SCSS，他們都沒有做我想做的事。我覺得這很難相信，因爲處理供應商前綴是編寫CSS最令人沮喪的部分，所以它似乎是任何編寫CSS框架的人都應該解決的第一個問題。自動處理供應商前綴的CSS框架？

我想知道，有沒有我可以使用的框架（或rails gem），允許我編寫border-radius:5px，然後讓我假設它會創建一個包含所有正確供應商前綴的規則？

感謝

2012-04-04 D-Nice

你看着羅盤（薩斯框架）？ – steveax 2012-04-04 21:32:33

是的，我也看了一下指南針，並沒有看到任何解決方案。 – 2012-04-05 04:35:39

來自Compass Docs - Compass核心框架 - Imports：[CSS3 - 提供跨瀏覽器CSS3 mixins，利用可用的預規格供應商前綴。]（http://compass-style.org/reference/compass/） – steveax 2012-04-06 01:18:24

實際上，你可以用較低的Mixin做到這一點很容易 - 基本上你寫了一次，從那裏出來，你有一條線應用它。就像這樣：

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

然後你symply做到這一點的一行，你需要一個邊界半徑：

.classname { 
    .border-radius(5px); 
}

如果你還沒有準備好少，那麼你可以只通過Prefixr處理您的代碼 - 它會爲您生成瀏覽器前綴（然後您必須將代碼複製粘貼回您的文件中）。

來源

2012-04-04 20:05:40 ryankeairns

您可以使用：http://sjevsejev.blogspot.com/2012/07/lessjs-function-generates-prefixes-for.html

那麼這將是足夠使用：

.pf('transition','all 1s ease-in-out'); 
.pf('border-radius',3px); 
.pf('box-shadow','2px 2px 5px 0 rgba(0,0,0,.6)'); 
.pf('flex', 1);

來源

2012-07-21 15:04:59

該鏈接看起來像你自己的博客。如果是的話，你可能想在答案中提到它。 – Flexo 2012-07-21 18:36:01

自動處理供應商前綴的CSS框架？

回答

相關問題