类似于这种，这个时候出现了周围变模糊，并且边缘泛白的情况

周围模糊这个问题很好解决，给父容器加overflow:hidden；就可以了

效果如上，至于周围泛白的问题就需要动点脑筋了，给目标添加 transform: scale(1.2);  放大为原来的1.2倍，这样泛白的部分就可以隐藏起来看不见了。

最终效果

使用filter: blur() 的时候解决图片周围泛白和容器外范围变模糊的问题的更多相关文章

  1. 数据恢复软件使用经验-支持U盘，手机SD卡，硬盘数据，解决图片恢复后打不开的问题

    数据恢复软件使用经验-支持U盘,手机SD卡,硬盘数据.解决图片恢复后打不开的问题. 用过非常多数据恢复软件.最早EasyRecovery pro.恢复过U盘.手机SD卡,硬盘数据.但如今下载不了最新版 ...

  2. <转载>CSS解决图片过大撑破DIV的方法

    DIV+CSS网页内容中如果插入大于DIV层宽度显示,过大的图片将会撑破网页宽度显示从而网页严重变形,您是否遇到过?这里DIVCSS5给大家介绍几种解决图片撑破撑开网页DIV层方法. 图片撑破宽度解决 ...

  3. object-fit 解决图片指定大小被压缩问题

    object-fit 解决图片指定大小被压缩问题 第一次遇到这个属性,是在给video 写 poster的时候,选取的作为poster的img的尺寸有点小,导致video播放器两边有留白.在控制台查看 ...

  4. AngularJS进阶(三十六)AngularJS项目开发技巧之利用Service&Promise&Resolve解决图片预加载问题(后记)

    AngularJS项目开发技巧之利用Service&Promise&Resolve解决图片预加载问题(后记) 前言 在"AngularJS项目开发技巧之图片预加载" ...

  5. 移动端高清适配方案（解决图片模糊问题、1px细线问题）

    本文介绍了移动端适配的3种方法,以及移动端图片模糊问题和1px细线问题的解决方法.当然了,在这之前先整理了与这些方法相关的知识:物理像素.设备独立像素.设备像素比和viewport. >> ...

  6. 一行css解决图片统一大小后的拉伸问题(被冷漠的object-fit)

    一.先来个实战 1. 测试案例 需求: 要求表情库里所有表情包大小都固定 实际效果: 由于图片原始大小都不一样,强行设定大小值会导致拉伸,如果不设定大小则参差不齐.例如: //html <bod ...

  7. js 解决图片居中问题

    下述方法能够解决图片居中问题: (1)宽一些或者高一些(相对父元素的大小):图片在父元素的可视范围内显示图片的中间位置 (2)小一些(相对父元素的大小):图片在父元素的可视范围内居中显示 实现原理:根 ...

  8. Halcon的HWindowControl控件在WinForm程序中的使用介绍（重点解决图片缩放的问题）

     Halcon的HWindowControl控件在WinForm程序中的使用介绍(重点解决图片缩放的问题) 2016-12-04 20:11 362人阅读 评论(4) 收藏 举报  分类: Halco ...

  9. 解决图片插入word文档后清晰度降低的问题

    解决图片插入word文档后清晰度降低的问题 在默认情况下,word程序会自动压缩插入word文档中的图片以减小整个word文档的.当我们需要插入word文档中的图片保持原始清晰度时,可以通过设置wor ...

随机推荐

  1. react 信用卡格式检验

    前言: 技术栈主要基于react + ant-design 描述: 填写信用卡卡号时,会自动四位空格,并格式校验判断卡种  ,这里我们业务只涉及到四种卡. 代码解析 // ant 组件自引,这里我只讲 ...

  2. indexOf和contains查找的字符串是空字符，返回值是什么呢？

    一直以为indexOf方法查找的字符串如果不匹配返回值就是-1.今天发现空字符返回值是0.看源码原来如此,阴沟里翻船啊!

  3. zabbix mysql 迁移 增加分区

    1.zabbix mysql 目录清单 --basedir=/usr/local/web/mysql --datadir=/data/mysql --log-error=/data/mysql/sys ...

  4. ElasticSearch部署问题

    以下几个是以前在自己部署ElaticSearch的时候收集到的,认为有用的 https://my.oschina.net/topeagle/blog/591451?fromerr=mzOr2qzZ h ...

  5. 4- vue django restful framework 打造生鲜超市 -restful api 与前端源码介绍

    4- vue django restful framework 打造生鲜超市 -restful api 与前端源码介绍 天涯明月笙 关注 2018.02.20 19:23* 字数 762 阅读 135 ...

  6. FreeRTOS的学习路线

    背景 由于之前接触过一些嵌入式RTOS,如Keil-RTX,uCOS-II,也曾经关注过FreeRTOS,但一直没有机会采用FreeRTOS开发.目前FreeRTOS做为主流RTOS,风声正盛.作为嵌 ...

  7. GoF23种设计模式之创建型模式之单态模式

    1概述 保证一个类仅有一个实例,并提供一个访问它的全局访问点. 2适用性 1.当类只能有一个实例而且客户可以从一个总所周知的访问点访问它的时候. 2.当这个唯一实例应该是通过子类化可扩展的,并且客户应 ...

  8. 使用JFreeChart生成报表

    1.JFreeChart简介    JFreeChart是JAVA平台上的一个开放的图表绘制类库.它完全使用JAVA语言编写,是为applications,servlets以及JSP等使用所设计.  ...

  9. 笔记-python-装饰器

    笔记-python-装饰器 1.  装饰器 装饰器的实质是返回的函数对象的函数,其次返回的函数对象是可以调用的,搞清楚这两点后,装饰器是很容易理解的. 1.1.  相关概念理解 首先,要理解在Pyth ...

  10. loj2055 「TJOI / HEOI2016」排序

    ref #include <iostream> #include <cstring> #include <cstdio> using namespace std; ...