如何让background在img标签的上面？
今天写了一个页面，客户要求在图片上面增加一个背景图片，刚开始感觉还挺不好写，遂百度之：
html结构
<div class="test">
<img src="circle.jpg">
</div>
css代码
.test {
background: url(abc.jpg) repeat;
position: relative;
width: 200px;
background-size: cover;
}
.test img {
width: 100%;
display: block;
position: absolute;
z-index: -1;
}
相关推荐
-
Git使用过程中常见的错误
发现学会了一项技能后用的机会并不多，今天需要在Github里面传一些源码，所以又重新使用了，总是记不住命令，还好之前做过笔记，复制粘贴即可，但在运行的过程中还是出现了一些问题，随百…
-
移动开发之像素的深入理解
许小珂在写这篇文章之前还没想好用什么标题，文章写了一大半了依然感觉写的挺乱的。权当是把自己的一些个人感悟进行下总结。 举个栗子在分享之前许小珂先问大家一个问题：一个背景为width…
-
手把手打造电商平台
需求拆分原则 单个迭代不宜太大 需求可交付，能够形成功能闭环 有成本意识，遵循二八原则 有预期的价值体现 提炼核心需求 架构设计–分层架构 …
-
如何安装本地服务器环境phpstudy
对于程序员来说，phpstudy是一个非常好用的PHP调试环境集成包，包含了最新的Apache和PHP等程序，对学习PHP的新手来说，WINDOWS下环境配置是一件很困难的事，对老…
-
px像素和em相对单位之深入理解
最近许小珂在研究响应式布局，我们都知道px代表像素的意思。在css中我们一般使用px作为单位，在桌面浏览器css的1个像素往往都是对应着电脑屏幕的1个物理像素，这可能会造成我们的一…
-
关于网页自适应百分比单位的使用
许小珂最近在研究自适应布局，深入研究让许小珂确实对css的属性的理解的更深刻了。今天就来介绍一下网页自适应所使用的百分比单位，希望能解大家的迷惑。不正确的地方也请高手指点出来，许小…
-
HTML meta标签介绍
我们在做前端开发的时候，在head部分会发现有很多meta标签，今天就来详细的总结下我们常用到的一些meta标签。 The <meta> tag provides me…
-
从布局看css基础
css布局 学习css的主要目的是为了记住各种属性么？NO，最重要的是理解css的定位机制与盒子模型。 接下来，从布局的角度来学习css的定位机制和盒子模型，学习之前还是先来提几个…
-
CSS 媒体类型介绍大全
最近许小珂正在研究响应式布局，也突然发现css中有很多媒体类型，今天特来总结一下 媒体类型允许你指定文件将如何在不同媒体呈现。该文件可以以不同的方式显示在屏幕上，在纸张上，或听觉浏…
-
Webpack入门教程
什么是WebpackWebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeS…
