jak zamazać obraz tła tylko w css

Witam próbuję rozmycie obrazu tła, ale myślę, że jej brakuje w ten sposób. Każda pomoc w tym zakresie zwiększy moją energię. Dziękijak zamazać obraz tła tylko w css

To mój 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; 

}

Próbuję zastosować to jednak plama wszystko moja strona instaed się tylko obraz tła.

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

Dziękuję.

Źródło

2016-07-14 Tanmoy Sarkar

Możliwy duplikat [Jak zastosować CSS 3 Filtr rozmycia obraz tła] (http://stackoverflow.com/questions/20039765/how-to-apply-a-css-3-blur-filter-to-a-background-image) –

@ TanmoySarkar Sprawdź link w komentarzu powyżej i powiedz nam, czy rozwiązanie pasuje do twoich potrzeb. – RDardelet

@RDardelet próbuję rozwiązać to z tym łączem .. pozwala zobaczyć. –

Jeśli zastosujesz rozmycie do <html>, spowoduje to rozmycie strony internetowej.

Zamiast dodawać tło do <html> Musisz utworzyć kolejny <div> z <body> o rozmiarze do rozmiaru strony internetowej i dodać do niego rozmycie.

Przykład

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>

Źródło

2016-07-14 06:09:42 Kan412

@tympazz dziękuję bardzo, to jest niesamowite ... to rozwiązuje moje wątpliwości, dziękuję. –

Przypisanie ID lub klasy atrybut znacznika obrazu lub div zawierającej obraz i przypisać właściwości css danego znacznika obraz lub strefa zawierający obraz. Zacierasz się na cały html, który oczywiście zaciera całą stronę.

Dla np

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

albo ty rozmycia obrazu-kontenera lub obrazek bezpośrednio podobnego lub obraz div

.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); 
}

Źródło

2016-07-14 06:14:47

Dziękuję wszystkim za życzliwą pomoc .. to rozwiązuje moją wątpliwość i zapytanie również .. dziękuję @ everyryone. :) –

jak zamazać obraz tła tylko w css

Odpowiedz

Powiązane problemy