arka plan görüntüsünü yalnızca css'de bulanıklaştırmak için:

Merhaba, arka plan resmini bulanıklaştırmaya çalışıyorum ama bunun eksik olduğunu düşünüyorum. Üzerindeki herhangi bir yardım, bunun için enerjimi artıracaktır. Teşekkürarka plan görüntüsünü yalnızca css'de bulanıklaştırmak için:

Bu benim CSS

html { 
    position: relative; 
    min-height: 100%; 
    max-width: 100%; 
    background: url(img/rsz_1spring.jpg); 
    background-repeat: no-repeat; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
max-width: 100%; 
    overflow-x: hidden; 

}

Bunu uygulamak çalışıyorum ama hepsi benim web sayfası arka plan görüntüsü sadece instaed bulanıklık.

-webkit-filter: blur(5px); 
-moz-filter: blur(5px); 
-o-filter: blur(5px); 
-ms-filter: blur(5px); 
filter: blur(5px);

Teşekkür ederiz.

kaynak

2016-07-14 Tanmoy Sarkar

Olası kopyalar background image] (http://stackoverflow.com/questions/20039765/how-to-apply-a-css-3-blur-filter-to-a-background-image) –

@TanmoySarkar Yukarıdaki yorumdaki bağlantıyı kontrol edin ve bize sundukları çözümün sizin ihtiyaçlarınıza uygun olup olmadığını söyleyin. – RDardelet

@RDardelet Ben bu bağlantı ile çözmeye çalışıyorum .. görelim. –

<html>'a bulanıklık uyguluyorsanız, web sayfanızı bulanıklaştırır.

<html> için arka plan eklemek yerine <body> numaralı Web sayfasının boyutuna sahip bir <div> oluşturmanız gerekir ve görüntü bulanıklığı ekleyin.

Örnek

body { 
 
    font-family: "Arial"; 
 
    color: #fff; 
 
} 
 

 
.page-bg { 
 
    background: url('http://www.planwallpaper.com/static/images/general-night-golden-gate-bridge-hd-wallpapers-golden-gate-bridge-wallpaper.jpg'); 
 
    -webkit-filter: blur(5px); 
 
    -moz-filter: blur(5px); 
 
    -o-filter: blur(5px); 
 
    -ms-filter: blur(5px); 
 
    filter: blur(5px); 
 
    position: fixed; 
 
    width: 100%; 
 
    height: 100%; 
 
    top: 0; 
 
    left: 0; 
 
    z-index: -1; 
 
}

<h1> 
 
This is a title 
 
</h1> 
 

 
<div class="page-bg"> 
 
</div>

kaynak

2016-07-14 06:09:42 Kan412

@tympazz Çok teşekkür ederim bu harika ... bu şüphemi çözüyor teşekkür ederim. –

atama kimliği veya resim etiketi veya sonra söz konusu resim etiketi veya div içeren görüntüye css özelliğini atamak görüntüyü içeren div class özelliğinin. Açıkça tüm web sayfasını bulanıklaştıracak tüm html için bulanıklaşıyorsunuz. eg için

<div class="image-container"><img class="blurred" src="..." /></div>

Ya görüntü konteyner veya doğrudan gibi veya div görüntü görüntüye bulanıklık

.image-container, .blurred, .image-container>img { 
    -webkit-filter: blur(5px); 
    -moz-filter: blur(5px); 
    -o-filter: blur(5px); 
    -ms-filter: blur(5px); 
    filter: blur(5px); 
}

bir bir CSS 3 bulanıklık filtresi nasıl uygulanır [arasında

kaynak

2016-07-14 06:14:47

Herkese iyi yürekli yardımlar için teşekkür ederim .. bu benim şüphe ve sorgumu da çözer .. teşekkür ederim @everyone. :) –

arka plan görüntüsünü yalnızca css'de bulanıklaştırmak için:

cevap

İlgili konular