반응 형 이미지 > 퍼블리셔팁

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.

반응 형 이미지 정보

CSS 반응 형 이미지

본문

반응 형 이미지

반응 형 이미지는 화면 크기에 맞게 자동으로 조절됩니다.

효과를 보려면 브라우저 창 크기를 조정하십시오.


31234ab8620368f9ba13b0aed9c8761d_1503985212_6002.png

원래 크기보다 커야하지만 확대되지 않은 이미지의 크기를 줄이려면 다음을 추가하십시오.


img {

    max-width: 100%;

    height: auto;

}


[전체소스]

<!DOCTYPE html>

<html>

<head>

<style>

img {

    max-width: 100%;

    height: auto;

}

</style>

</head>

<body>


<h2>Responsive Images</h2>

<p>Responsive images will automatically adjust to fit the size of the screen.</p>

<p>Resize the browser window to see the effect:</p>


<img src="trolltunga.jpg" alt="Norway" width="1000" height="300">


</body>

</html>


추천
0

댓글 0개

전체 1,264
퍼블리셔팁 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT