How to blur an image (super easy)
Easy! How to blur the background image
Just add a word to your CSS and you're good to go!
java:index.html.erb
<%= image_tag "star.webp", class:"bgimage" %>
The above class name is your choice! Next is CSS !!
○○.css
.bgimage{
filter: blur(5px);
width: 100%;
}
As mentioned above, add filter: blur (5px); </ font> and it's OK!
It is 5px </ font>, but you can adjust the blur depth to 1 or 10 so you can use it as you like!
If you set the width to 100%, the screen width will be perfect, so don't forget this too!
That's all from the scene!
Recommended Posts