html - 如何在 css 和 html 中将图像的阴影放在其下方的另一个图像上?

标签 html image css

<html>
  <head>       
    <link rel="stylesheet" href="layout.css" type="text/css" />
  </head>        
  <body>
    <h1>LOGO</h1>
    <div id="linker">
      <a href="http://www.facebook.com"><img src="img1.png"></a>
      <a href="http://twitter.com"><img src="tw.png"></a>        
    </div>
  </body>
</html>

如何为 pic1 和 pic2 添加阴影。有什么办法可以像另一个一样投影?

最佳答案

投影不会与同一 z 级别上的元素重叠。使用 position: relative(或绝对)并使用 z-index 更改元素的级别。

将前面的那个放在更高的位置,例如:

#linker a:first-child {
  position: relative;
  z-index: 10;
  box-shadow: 0 0 10px #000;
}

关于html - 如何在 css 和 html 中将图像的阴影放在其下方的另一个图像上?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25091801/

相关文章:

javascript - HTML5 全屏 API 和 DIV

c - C中大图像和窄图像的转置

html - 如何将输入值修正为 2022 年 12 月?

javascript - 页面顶部的 CSS 菜单

HTML - div 旁边的文本没有给它一个固定的宽度

python - 使用 pygtk 设置图像在窗口中的位置

java - 可以在 JTextArea 上显示图片吗?

css - 使列高度相同

javascript - 新手程序员 = "Need explanation on this JQUERY smoothscrolling code"

html - 使用 HTML 和 CSS 布局内容