How to make an img blur when hovering over it? [closed]

-4

I'm having difficulty with this element of the site that I am trying to set up for school, if it is not possible for a site to perform this function let me know.

    
asked by anonymous 18.08.2017 / 03:34

1 answer

2

You can see here ,

Update: Thanks Diego Schmidt for the remark, as it appears in Microsoft documentation .

  

Note: As of Windows Internet Explorer 9, this feature has been deprecated. Starting with Internet Explorer 10, this feature was   removed and should no longer be used.

    img {
      transition: .3s all;
      border-radius: 3px;
    }
    .bg:hover img {
      -webkit-filter: blur(2px);
      filter: blur(2px);
    }
    <div class="container">
      <div class="bg">
        <img src="https://unsplash.it/400/200"alt="">
      </div>
    </div>
    
18.08.2017 / 03:43