모바일과 PC에서 각각 동작하는 CSS

팁 | 2024.05.23

    .daerew { 
        background: #EEE;
        text-align: justify;    
        }
    @media only screen and (max-width: 767px) {  /* 모바일에서 작동 */
        .daerew { padding: 0 3rem 5rem 3rem; }
        }
    @media all and (min-width:767px) { /* 데스크 탑에서 작동 */
        .daerew { padding: 0 7rem 5rem 7rem; }
        }

오래 전에는 홈페이지를 만들 때 모니터 크기가 다르고 브라우저가 다른 것을 고려해야 했다면,

이제는 모바일을 고려해야 하고 오히려 모바일 중심으로 만드는 것이 대세기 때문에 미디어쿼리가 필수적이다.

위로 아래로 댓글로 가기

?댓글 쓰기

에디터 선택하기

? 텍스트 모드 ? 에디터 모드

댓글 쓰기

에디터 사용하기 닫기

Comments '1'

나그네 2024.11.30 03:28

제로보드 시절 많은 도움을 받았던 대류님. 문득 생각이나서 검색해보니 이 블로그를 발견. 잘 지내고 여러모로 성공 하신 것 같아 기분이 좋아집니다. 얼굴도 이름도 모르지만 오래전 인터넷을 통해 알게 된 분의 소식이 왜 이렇게 반가운 건지.

수정 삭제 댓글

2026/04/06 in 팁
Views 0

Synology NAS Let's Encrypt 보안 인증서 발급 안 될 때
No Image 2024/05/23 in 팁
Views 2 Replies 1

모바일과 PC에서 각각 동작하는 CSS
No Image 2024/04/29 in 팁
Views 0

반응형 웹 CSS 미디어쿼리
No Image 2023/08/06 in 팁
Views 1

Rhymix → Rhymix 마이그레이션 툴
2021/04/02 in 팁
Views 0

반응형 웹페이지 드롭 칼럼
2019/06/21 in 팁
Views 0

서버 이전 후 이미지 깨짐 현상 / 경로 일괄 변경
2019/01/21 in 팁
Views 0

Synologe NAS에서 홈페이지 운영 시 크롬에서 보안경고 없애기
2018/09/15 in 팁
Views 4 Replies 2

Synology NAS에 도메인 연결하기
2012/01/02 in 팁
Views 3220

XE 이미지 좌측 정렬시 내용이 적으면 아래부분 올라오는 문제 해결법
No Image 2012/01/02 in 팁
Views 3601 Replies 4

XE 기본 카운터의 방문자 / 페이지뷰 출력하고 수정하기
2012/01/02 in 팁
Views 2570

XE 소스 수정 없이 카테고리 자동 선택하기
No Image 2012/01/02 in 팁
Views 2916

rewrite rule 예외처리하기
No Image 2011/02/10 in 팁
Views 8721

일러스트에서 아웃라인 따는 방법
2010/03/29 in 팁
Views 10961 Replies 3

대류커뮤니티 v4에 사용된 계정 및 DB현황 출력
No Image 2007/03/13 in 팁
Views 12659

대류가 사용하는 에러페이지 소스
No Image 2006/05/05 in 팁
Views 9706

원하는 부분만 인쇄하기
2006/02/11 in 팁
Views 11566 Replies 1

웹에서 인증을 받고 페이지 들어가기
2006/02/11 in 팁
Views 2

웹에서 인증을 받고 페이지 들어가기
No Image 2005/07/27 in 팁
Views 9959

원하는 날에, 원하는 곳에, 원하는 이미지 띄우기
No Image 2005/07/27 in 팁
Views 1

원하는 날에, 원하는 곳에, 원하는 이미지 띄우기