Overflow:Hidden 在 Div 中无法正常工作

Question

所以，我是新手，我正在研究一个基本的重定向 Tumblr 主题[不重要]，但我有一个横幅，它是一个 div 框，我想适应图像就像我使用 overflow:hidden 一样。唯一的问题是，该命令不起作用。必须复制和粘贴部分代码，我认为 c/p 编辑的 css 中的某些内容使它无法正常工作。另外，如果我的代码写得很糟糕，请提前道歉，我又是新手。

上面写着 'this blog has moved' 的白色 background/banner 是我要隐藏的内容，因此它不会与边框重叠。

    <!DOCTYPE HTML>
<HTML>
<HEAD>

  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">


</HEAD>
<STYLE>


 body {background-color: #dff2f4;}



  img {
  height: 500px;
  width: 710px;
  margin-top: 100px;
  margin-left: 355px;
  border-width: 15px;
  border-radius: 50px;
  border-style: double;
  border-color: white;
  overflow: hidden;
  background-color: #cbdaff;
 }


 .centered {
  font-family: 'SourceSansPro-ExtraLight';
  transform: translate(-50%, -50%);
  background-color: white;
  text-align: center;
  position: absolute;
  color: #dadada;
  top: 50%;
  left: 50.7%;
  width: 750px ;
  font-size: 30px;
  letter-spacing: 10px;
  overflow: hidden;
  padding: 7px 7px 7px 7px;




}



 @font-face {
    font-family: 'SourceSansPro-ExtraLight.ttf';
    src: url('fonts/SourceSansPro-ExtraLight.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}



</STYLE>
<BODY>

 <div class="banner">
  <div class="centered">THIS BLOG HAS MOVED</div>

 <img src="https://66.media.tumblr.com/0ec32bfc5aeafd4db56b123737224ef8/tumblr_pn6qcyuFhy1xiq9t5o2_r1_540.gif">



 </div>












</BODY>
</HTML>

Answer 1

这是？

body {background-color: #dff2f4;}

.img {
 background: url("https://66.media.tumblr.com/0ec32bfc5aeafd4db56b123737224ef8/tumblr_pn6qcyuFhy1xiq9t5o2_r1_540.gif");
 height: 500px;
 width: 710px;
 margin-top: 100px;
 margin-left: 355px;
 border-width: 15px;
 border-radius: 50px;
 border-style: double;
 border-color: white;
 overflow: hidden;
 background-color: #cbdaff;
}

.centered {
 font-family: 'SourceSansPro-ExtraLight';
 transform: translate(-50%, -50%);
 background-color: white;
 text-align: center;
 color: #dadada;
 margin-top: 50%;
 width: 750px ;
 font-size: 30px;
 letter-spacing: 10px;
 padding: 7px 7px 7px 7px;
}

@font-face {
 font-family: 'SourceSansPro-ExtraLight.ttf';
 src: url('fonts/SourceSansPro-ExtraLight.ttf') format('truetype');
 font-weight: normal;
 font-style: normal;
}

<div class="banner">
  <div class="img">
   <div class="centered">THIS BLOG HAS MOVED</div>
  </div>
 </div>

Overflow:Hidden 在 Div 中无法正常工作

Overflow:Hidden isn't working correctly in Div

css

overflow