Twitter bootstrap hex to rgba?

Question

Benim sayfalarımda kullanılan bir değişken var.

Değişken, #f57e20 altıgen biçimindedir.

Bu rengi kullanmak istiyorum ancak buna bir alfa kanalı ekleyin.

Ben rgba(245, 126, 32, 0.5)

ile bitirmek istiyorum önyükleme mu yoksa bu bir ilgisi var .less?

Answer 1

vardır bir sen kullanabilirsiniz Bootstrap gelen less.js ve Mixins içinde yerleşik işlev bazı:

Bunlar hem neden:

Bu less.js fonksiyonudur

.test { 
    background: rgba(245, 126, 32, 0.5); 
} 
.test2 { 
    background: rgba(245, 126, 32, 0.5); 
} 

Veya bir önyükleme mixin kullanın:

.test3 { 
    #translucent > .background(#f57e20, 0.5); // use HSLA mixin 
} 

sonuçlanır

:

.test3 { 
    background-color: rgba(244, 123, 31, 0.5); 
} 

Ben olacak (son ben kontrol) artık Bootstrap 3.0.0 itibariyle dahil edildiğinden, arşivleme amacıyla buraya translucent Mixins için (sabit) kodu içerir:

// Add an alphatransparency value to any background or border color (via Elyse Holladay) 
#translucent { 
    .background(@color: @white, @alpha: 1) { 
    background-color: fade(@color, @alpha); 
    } 
    .border(@color: @white, @alpha: 1) { 
    border-color: fade(@color, @alpha); 
    .background-clip(padding-box); 
    } 
} 

denemek isteyebilirsiniz

Answer 2

:

background: rgba(red(@color), green(@color), blue(@color), @alpha); 

Ben kutu sh kullanılan hızlı bir mixin yazarken benzer bir şey yapmak zorunda adow.