미디어위키:Mobile.css

항공위키
Sayme (토론 | 기여)님의 2023년 1월 23일 (월) 22:45 판 (새 문서: →‎여기의 모든 CSS는 모바일 사이트를 사용하는 사용자에게 로드됩니다: .airlines_info, .apo_info, .people_info, .air_movie { width: 100%; border: 1px solid #dddddd; background-color: #f9f9f9; color: #001133; margin: 0.5em 0 0.5em 1em !important; padding: 0.2em; clear: right; text-align:left; box-shadow: 0 1px 2px 1px rgb(0 0 0 / 4%); } .t-inner-padding { padding: 0 0.6em; word-break: break-all; } →‎섬네일 이미지: .thumbinner, .img_box .thumb...)
(차이) ← 이전 판 | 최신판 (차이) | 다음 판 → (차이)

참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.

  • 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
  • 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
  • 인터넷 익스플로러 / 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
  • 오페라: Ctrl-F5를 입력.
/* 여기의 모든 CSS는 모바일 사이트를 사용하는 사용자에게 로드됩니다 */

.airlines_info, .apo_info, .people_info, .air_movie { width: 100%; border: 1px solid #dddddd; background-color: #f9f9f9; color: #001133; margin: 0.5em 0 0.5em 1em !important; padding: 0.2em; clear: right; text-align:left; box-shadow: 0 1px 2px 1px rgb(0 0 0 / 4%); }
.t-inner-padding { padding: 0 0.6em; word-break: break-all; }

/* 섬네일 이미지 */
.thumbinner, .img_box .thumbinner { padding: 10px; /* border: 1px solid #ddd; */ box-shadow: 1px 1px 10px #ddd; border-radius: 5px; background-color: white; }

/* 본문 div 박스 안에 이미지 사이즈 조절 */
.img_box { width: 400px; text-align: center; margin: 10px 0 20px 10px; }
.img_box > img { object-fit: cover; width: 100%; border-radius: 5px; }
/* img { object-fit: cover; width: 100%; } */

/* 본문 안 iframe 사이즈 맞춤 */
.mov_box { width: 400px; text-align: center; margin: 10px 0 20px 10px; }
.mov_box > iframe { display:block; width:100%; height: auto; border-radius: 5px; }

/* 항공역사 버튼 */
.history_box { margin: 30px auto 20px auto; width: fit-content; }
.history_center { display: inline-block; padding: 5px 20px; border-radius: 3px; background-color: #EBEBEB; font-weight: 600; margin: 0; }
.history_left { display: inline-block; padding: 5px 20px; border-radius: 18px 0 0 18px; background-color: #EBEBEB; font-weight: 600; } 
.history_right { display: inline-block; padding: 5px 20px; border-radius: 0 18px 18px 0; background-color: #EBEBEB; font-weight: 600; }

/* 화면 폭에 따른 자동 변경 */
@media (max-width: 640px) {
  .main-board { display: none; margin: 15px 10px 0 0;} /* display: block; */
  .history_box { margin: 30px 0 20px 0; width: 100%; text-align: center; }
  .history_center { margin: 0; text-align: center; padding: 5px 0; width: 100%; border-radius: 18px; }
  .history_left, .history_right { display: none !important; }
  .img_box { width: 100%; }
  .thumbinner, .img_box .thumbinner { width: 150px !important; }
}


/* 항공사, 인물 등 박스 100% 확장   */
@media (max-width: 720px) {
	.content table { display: inline-table;}
}