Question

有谁知道如何使图片周围有一些白色边缘。

代码：

<html>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<title>Page Title</title>
</head>
<style>

.button {
  background-color: #1700e8;
  border: none;
  color: white;
  padding: 1rem;
  text-align: center;
  font-family: Segoe UI;
  display: inline-block;
  font-size: 14px;
  letter-spacing: 2px;
  cursor: pointer;
  width: 300px;
}





</style>
<body>

<img src="Selectie2.png" style= "position:inherit; top: -15px; left:100px width: 300px; height: 300px;">

<button class="button button1" style= "position:relative; top:-5px; left: 2px;">Gerrie Eijlers</button>
<button class="button button1" style= "position:relative; top:-5px; left: 26px;">Bart Ravensbergen</button>
<button class="button button1" style= "position:relative; top:-5px; left: 50px;">Alec Smit</button>
<button class="button button1" style= "position:relative; top:-5px; left: 74px;">Bobby Schagen</button>
<button class="button button1" style= "position:relative; top:-5px; left: 98px;">Dani Baijens</button>
<button class="button button1" style= "position:relative; top:-5px; left: 124px;">Ephrahim Jerry</button>

</body>

</html> ```

Answer 1

只需使用border css属性，如下所示：

img {
  border: #FFF solid 1px;
}

我建议您在id标签中添加一个<img>属性，这样您的样式就不会像下面那样应用于其他图像：

<img id ="someImg" src="Selectie2.png" alt="someImg" />

#someImg {
  border: #FFF solid 1px;
}

如果您想要更粗或更细的白色边框，只需相应地更改1px值即可。

如何在图像周围添加白色边缘？

1 个答案: