<p>다음 이미지에 표시된 내용을 HTML로 복사해야 합니다. </p> <p>문제는 텍스트가 div와 배경 이미지를 덮고 있다는 것입니다. 외부 div에 이미지가 없고 단색이 없는 경우 둥근 모서리가 올바른 위치에 배치된 일부 작은 html 요소를 사용하여 이 작업을 상당히 쉽게 수행할 수 있다고 상상할 수 있지만 배경 이미지가 복잡성을 추가합니다. </p> <p>지금까지 저는 이것을 가지고 있습니다... 보시다시피 저는 두 개의 둥근 모서리에 붙어 있습니다. 누구든지 해결책을 제안할 수 있나요? <strong>모든 최신 브라우저</strong>에서 작동해야 합니다. </p> <p> <pre class="brush:css;toolbar:false;">#outer { 너비:100%; 높이:400px; 테두리 반경:20px; 배경 이미지:url(https://media.istockphoto.com/id/1323032473/es/Vector/panal-abstracto-de-Vector-azul-moderno-con-fondo-de-monitor-de-coraz%C3% B3n-con-para-la.jpg?s=2048x2048&w=is&k=20&c=mXe4wSHc8kAcOXastbN9jhinrWGQX3vvJQUhDgvOcqA=); 위치:상대적; } #내부텍스트 { 표시:인라인; 테두리 상단 오른쪽 반경:20px; 배경색:#fff; 패딩:5px 25px 0px 5px; 글꼴 크기:40px; 색상:#000; 위치:절대; 하단:0px; }</pre> <pre class="brush:html;toolbar:false;"><div id="outer"> <div id="innertext">두 줄로 구성된 테스트 제목<br></div>