[RUBY] So verwischen Sie das Bild (super einfach)

Einfach! So verwischen Sie das Hintergrundbild

144f999b1a92884d6f066877ca4bb31e.jpg

Fügen Sie einfach ein Wort zu CSS hinzu und es ist OK!

java:index.html.erb


<%= image_tag "star.webp", class:"bgimage" %>

Der obige Klassenname ist Ihre Wahl! Als nächstes kommt CSS !!

○○.css


.bgimage{
  filter: blur(5px);
  width: 100%;
}

Wie oben erwähnt, fügen Sie den Filter hinzu: blur (5px); </ font> und es ist OK!

Es ist 5px </ font>, aber Sie können die Unschärfetiefe auf 1 oder 10 einstellen, damit Sie sie verwenden können, wie Sie möchten!

Wenn Sie die Breite auf 100% einstellen, ist die Bildschirmbreite perfekt. Vergessen Sie dies also nicht!

Das ist alles von der Szene!

Recommended Posts