在HTML中围绕它的阴影窗口

Question

如何在网页中创建带有阴影的窗口（某种东西）。 感谢

Answer 1

<tr v-for="skill in paginatedSkills" ...>          
    <td v-for="header in headers" v-bind:class="header.classes">{{skill[header.key]}}</td>
</tr>

.box{
 height: 100px;
 width: 300px;
 border: 1px solid black;
 box-shadow: 0px 5px 15px grey;
}

制作自定义阴影你可以访问 Here

或在 here

了解盒子阴影

Answer 2

使用框阴影

＆＃13;

＆＃13;

.container {
  background-color: #d9d7d7;
  padding: 1em;
  box-shadow: 0px 0px 12px 0px #5f5f5f;
}

＆＃13;

<div class="container">
  <!-- Insert content inside here -->
  <p>
    Test content
  </p>
</div>

＆＃13;

＆＃13;

＆＃13;

此外，额外的建议，如果您有一个包含您想要模仿的html / css的网页，请使用inspect元素。你可以看到html和css结构，这样你就可以看到它是如何完成的！