scss 更好的破碎图像

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss 更好的破碎图像相关的知识,希望对你有一定的参考价值。

img {  
  min-height: 50px;

	&:before {  
	  content: " ";
	  display: block;
	  position: absolute;
	  top: -10px;
	  left: 0;
	  height: calc(100% + 10px);
	  width: 100%;
	  background-color: rgb(230, 230, 230);
	  border: 2px dotted rgb(200, 200, 200);
	  border-radius: 5px;
	}

	&:after {  
	  content: "Broken Image of " attr(alt);
	  display: block;
	  font-size: 16px;
	  font-style: normal;
	  color: rgb(100, 100, 100);
	  position: absolute;
	  top: 5px;
	  left: 0;
	  width: 100%;
	  text-align: center;
	}

}

以上是关于scss 更好的破碎图像的主要内容,如果未能解决你的问题,请参考以下文章

css 破碎的图像占位符

css CSS - 风格破碎的图像

css CSS - 风格破碎的图像

离子2/3:可以隐藏破碎图像的“div”吗?

如何制作破碎/波浪状的网格

图片破碎 效果 修正