화면 크기가 변경 될 때 이미지 크기를 조절하지 않게하는 방법

지금은 화면 크기가 변경 될 때 이미지의 크기가 조정되도록 내 wordpress 사이트가 설정되었습니다. 대신 이미지가 화면 중앙의 특정 크기로 유지되고 화면 크기가 변경 될 때 왼쪽과 오른쪽에서 똑같이 자르기를 기대했습니다.화면 크기가 변경 될 때 이미지 크기를 조절하지 않게하는 방법

나는 max-width : none 시도했지만 페이지의 중앙에 이미지를 유지하고 자르지 않습니다.

사이트 : Zxndesignco.com

는 문제의 이미지는 홈 페이지에있는 유일한 이미지입니다. 나는 CSS 만 알고 있으므로 CSS 솔루션이 있기를 바랬습니다.

내가 대해 복용하고있는 무슨의 예 : 도움을 https://gatewaydemo.wordpress.com/

감사합니다.

출처

2017-01-24 BL91

일반적인 아이디어는 이미지를 사용하지 않고 그 영웅 섹션의 이미지를 background-image으로 만드는 것입니다. 그래서 img 태그를 삭제하고 보통 몸이나 div에 .sow-image-containerheight: 400px; background: url(https://zxndesignco.com/wp-content/uploads/2016/12/HomeImg.jpg) center top; background-size: cover

출처

2017-01-24 22:57:43

하하하하. 내가 거기로 가고 있었다.하지만 그래, 그렇게하는 길이다. – scoopzilla

헤이 마이클, 고마워. 그것은 완벽하게 작동했습니다! 문제는 그 이미지가 홈 페이지가 아닌 다른 페이지에 나타나지 않게하려는 것입니다. 어떤 제안. 감사합니다 – BL91

@ BL91 대신'.home .sow-image-container'를 목표로 삼습니다. –

body{ 
 
    background-repeat:no-repeat; 
 
\t background-position:center center fixed; 
 
\t background-image:url(https://zxndesignco.com/wp-content/uploads/2016/12/HomeImg.jpg); 
 
\t background-attachment:fixed; 
 
\t -webkit-background-size: cover; 
 
\t -moz-background-size: cover; 
 
\t -o-background-size: cover; 
 
\t background-size: cover; 
 
    height: 100%; 
 
    } 
 
.white{ 
 
    font-size: 24px; 
 
    color: #fff; 
 
}

<div> 
 
    <p class="white">Here are some words</p> 
 
    </div>

이 CSS 같은 것을 추가 할 수 있습니다. 이 그룹은 모든 브라우저 기반을 다루기 때문에이 그룹이 마음에 듭니다.

출처

2017-01-24 23:04:12 scoopzilla

화면 크기가 변경 될 때 이미지 크기를 조절하지 않게하는 방법

답변

관련 문제