用相对定位和负向移动完成图片象框阴影

MC罗

MC罗

2016-02-19 17:27

今天图老师小编给大家精心推荐个用相对定位和负向移动完成图片象框阴影教程,一起来看看过程究竟如何进行吧!喜欢还请点个赞哦~

先看看代码,十分简单:

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

以下是引用片段:
style
.out {
  position:relative;
  background:#bbb; 
  margin:10px auto;
  width:285px
  }
.in {
  background:#fff; 
  border:1px solid #555;
  padding:10px 5px;
position:relative; 
  top:-5px;
  left:-5px;
  }
/style

div class="out"
div class="in"
img src="/imagelist/06/24/k6xq28872yvo.jpg" alt="" /
/div
/div

style
.out {
  position:relative;
  background:#bbb;
  margin:10px auto;
  width:285px
  }
.in {
  background:#fff;
  border:1px solid #555;
  padding:10px 5px;
  position:relative;
  top:-5px;
  left:-5px;
  }
/style

div class="out" div class="in" img src="/imagelist/06/24/k6xq28872yvo.jpg" alt="" / /div/div
运行代码复制代码另存代码

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)
展开更多 50%)
分享

猜你喜欢

用相对定位和负向移动完成图片象框阴影

Web开发
用相对定位和负向移动完成图片象框阴影

CSS中关于相对定位和绝对定位

Web开发
CSS中关于相对定位和绝对定位

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

CSS网页布局教程:绝对定位和相对定位

Web开发
CSS网页布局教程:绝对定位和相对定位

CSS层的应用及其定位(绝对定位和相对定位)

Web开发
CSS层的应用及其定位(绝对定位和相对定位)

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

css布局定位系列:相对定位

Html CSS布局 Div+CSS XHTML
css布局定位系列:相对定位

CSS网页中的相对定位与绝对定位

Web开发
CSS网页中的相对定位与绝对定位

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

用 Joomla! 搭建一个社会网络站点

用 Joomla! 搭建一个社会网络站点

在Delphi中巧改窗体文件实现控件数组

在Delphi中巧改窗体文件实现控件数组
下拉加载更多内容 ↓