0
내 사이트를 반응 형으로 만들기 위해 노력 중이며 헤더 이미지에 문제가 있습니다. 이미지는 얼굴 사진이며 오른쪽에 정렬됩니다. 모바일 및 태블릿 모두에서 이미지가 하단과 우측에서 잘립니다. 헤드 샷을 가운데에 배치하고 내 머리글 (모바일 및 태블릿에서) 상단에 h1, h3 및 p 위에 표시하고 싶습니다. 내 이미지를 계속 오른쪽 (바탕 화면)에 정렬하면서이 작업을 수행 할 수있는 방법이 있습니까? 감사!헤드 샷 이미지 반응하기
HTML
<!-- Header -->
<header class="masthead">
<div class="container">
<div class="intro-text">
<h1>voluptatem accusantium</h1>
<h3 style="margin-top:-2%">UX Research & Design</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. </p>
</div>
</div>
</header>
CSS
header.masthead {
text-align: left;
color: white;
background-image: url("../img/headshot.png");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: right 85px top 80px;
background-size: 400px 481px
}