맥을 사용하시는 분들에게 문의입니다.
혹시 사파리 브라우저에서는 크롬 처럼 요소보기가 되나요?
크롬 브라우저에서는 이상없이 잘 작동하는데...
아이패드를 보면서
사파리 브라우저에는 아무리 해도 답이 없습니다.
원하는 내용은 간단합니다.
웹의 중간에
아주 좌우로 넓은 사진을 올려놓고
화면의 폭이 줄면 사진은 그대로 두고 사진의 좌우의 사진이 나오지 않도록 하는 것인데...
정말 힘드네요.
참고한 웹페이지의 css 태그는 이렇습니다.
예전에 나를 도와준 마틴님이란 분이 있어 그분을 기억합니다.
2cpu의 도움주신 많은 분들께 늘 감사드립니다.
☎ HP 010-9678-7900
2cpu의 도움주신 많은 분들께 늘 감사드립니다.
☎ HP 010-9678-7900
가운데만 보여주는 예제 - https://codepen.io/ibin79/pen/KjxBEm
실제 이미지 - https://pixabay.com/get/57e7d0454855a814f6d1867dda6d49214b6ac3e45657734d752f7bd794/sunrise-1756274_1920.jpg
이것을 기반으로 연구 해보겠습니다.
너비가 큰 이미지의 가운데만 보여주기의 css가
참 필요한데.... 어렵더군요.
잘해보겠습니다.
사진 3장을 보여주는데,
A는 가운데, B는 왼쪽, C는 오른쪽에 있다고 가정.
정렬할 때 A는 center, B는 left, C는 right .
정렬 순서는 A를 맨 먼저 배치, 그 다음으로 B와 C 순서. (이때 줄간격은 0 또는 완전히 겹치게)
화면의 폭이 줄어들면 B와 C는 사라지게 한다. or A 그림 뒤로 보낸다. or 안 보이게 한다.
안 보이게 하는 것은 hidden 처리하면 되는데, 빈 공간 처리 문제가 생길 거 같습니다.
사라지게 하는 것은 개체 자체를 없애야 하는데, css만으로는 불가능할 거 같습니다.
결국 A 그림 뒤로 보내는 거만 남겠네요.
A 그림 뒤로 보내는 것은 Z-index 및 overflow 조절하면 가능하다고 알고 있습니다.
아이폰/아이패드 설정 > safari
여기에서 맨 아래에 가면, "고급" 메뉴가 있습니다. 터치!
"웹속성"을 일단 활성화합니다.
그 뒤에 거기에 나온 대로, 컴퓨터에 윈도우용/맥용 사파리를 설치한 뒤에 작업하면 됩니다.
참고 사이트 - https://unikys.tistory.com/342