Question

请帮我看看这个div看起来如下图所示。我尝试使这项工作，但似乎我遗漏了一些东西，请帮助我使我的代码更准确。我试图研究，但我找不到解决方案。希望有人可以帮助我。

div {
  width: 100%;
  background-color: #ccc;
  border: 1px solid black;
  border-left-width: 4px;
  font: bold 22px/100px Arial, Sans-Serif;
  color: black;
}

#mybtn1 {
  position: relative;
  font: bold 12px/50px Arial, Sans-Serif;
  width: 400px;
  height: 200px;
  top: -210px;
  left: 110px;
  float: right;
  transition: transform 0.5s ease;
  border: 2px solid #a1a1a1;
  border-radius: 15px;
  background-color: ;
  overflow: hidden;
}

#mybtn1:hover {
  transform: scale(1.25);
}

#div1 {
  height: 400px;
  margin-top: 90px;
}

#div1 img {
  height: 400px;
}

#mybtn1 img {
  position: relative;
  margin-top: -50px;
  float: left;
  width: 30%;
  margin: auto 10px;
}

#mybtn1 h1,
#mybtn1 p {
  margin-left: 140px;
  /* = image width + 8 */
  margin-top: 10px;
  position: relative;
  line-height: 1.1em;
}

#mybtn1 h1 {
  left: 50px;
}


}

<html>

<body>

  <div id="div1">
    <img src="rice.jpg" />
  </div>

  <div id="div2">DIV 2</div>
  <ul>
    <li>
      <div id="mybtn1">
        <h1>Title </h1>
        <img src="logo1.png" />
        <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. R</p>
        <svg class="icon-arrow" viewBox="0 0 137.648 256">
				<polygon class="line" points="0,246.161 9.843,256 137.648,128.2 137.451,128.003 137.648,127.806 9.843,0 0,9.833 118.167,127.996 " style="stroke-width:2"></polygon>
				</svg>
      </div </li>
      <ul>
</body>


</html>

Answer 1

代码中的语法无效，请按此修复：

Error occurred starting thread group […] Module Controller has no selected Controller

div中的图像，内容和箭头

1 个答案: