Question

我找不到其他人有这个问题，所以这似乎是某种“我”的问题。在我的网页中，我在所有内容周围放置了一个透明框，但出于某种原因，它不会一直延伸到图像之外，而只会附着在文本上。我一直试图解决这个问题一个小时，但我什么也没得到。有什么帮助吗？

这是我的相关代码：

/*Transparent box around text*/
  #diva {
  background: transparent;
  background-color: rgba(07, 07, 07, 0.767);
  border-radius: 25px;
  width: 65%;
  margin: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 60px;
  }
/*image*/
img {
    float: left;
    position: relative;
    padding: 20px;
    margin: 20px;
  }

/*The picture*/
<img src= "pics/axel-chest.PNG" alt="" style="width:300px;height:450px;">

Answer 1

我不知道你在 HTML 中做了什么，但你必须这样做

HTML

<div id='diva'>
   <img src= "pics/axel-chest.PNG" alt="" style="width:300px;height:450px;">
</div>

CSS

#diva{
  border: 2px solid red;
}

背景：透明不是必需的，因为当你在文本周围制作框时它已经是透明的

该边框将环绕您的文本，然后根据需要进行自定义

文本框不会环绕图像

1 个答案: