11.Nas_1
새창 작성 수정 목록 링크 Edit G카랜다 HDD HDD HDD 게시물 주소 복사

CSS3 미디어쿼리와 스크린 경계 > 퍼블리싱강좌

♨ 카랜더 일정 :
  • 링크
    https://sir.kr/pb_lecture/167 2846 회 연결
    회 연결
  • 첨부

    • 작성자 정보

    컨텐츠 정보

    본문

    우선 해야할 일

    반응형 웹을 하기 위해서 기본적으로 설정/선언하거나 포함해야 할 항목들이 있습니다.

    viewport meta tag 설정

    요약

    아래코드를 <head></head> 에 넣으세요.

    1<meta name="viewport" content="width=device-width, initial-scale=1.0">
    긴설명

    반응형 웹으로 디자인 하는 것이므로, iOS 기기에서 데스크탑 웹사이트 (레이아웃)을 보고 싶지는 않을 것입니다. 그러기에 모바일 스크린에 맞게 폭과 스케일을 설정하는 것입니다. 특히, 위 설정은 iOS 전용 설정입니다. Android는 위 설정없이 ‘적절하게’ 렌더링합니다.

    width=device-width

    모바일 브라우져 (특히 iOS 사파리)에서 디바이스 폭보다 큰 웹페이지를 불러오면 좌우 스크롤이 되도록 렌더링합니다. 이런 문제? 를 해결하기 위해서 width를 device-width로 설정하면 해당 기기의 폭에 맞추어서 웹 페이지를 렌더링합니다. 참고로 Android는 width 설정에 상관없이 화면폭에 맞춰서 렌더링합니다.

    VHvMnXvIRIRB6o0ICXm9lIcFt0myZIBxe3uoNloJtHg7OyHZJ0BB_PimZRoSuUzICo9jbU-_oJKAjwPu-7MK-V-aVkoZuiLL9NgPwZpkc2Vi8id1Uaj7

    viewport 설정이 되어있지 않는 웹 페이지를 iPhone에서 봤을때 (왼쪽)와 viewport 설정이 되어 있는 경우의 iPhone에서 볼떄 (가운데), 그리고 viewport 설정과 상관없이 Android에서 볼때 (오른쪽): 출처 - https://docs.google.com/present/view?id=dkx3qtm_22dxsrgcf4

    -------------------------------------- ♠ 출처는 링크 참조 바랍니다. https://11q.kr ♠

    [ 추가 정보 ... 더보기) ]
    뷰PDF 1,2
    office view

    관련자료

    댓글목록

    등록된 댓글이 없습니다.

    목록
    글검색
    새창 작성 수정 목록 링크 Edit G카랜다 HDD HDD HDD 게시물 주소 복사

    Total 1,683 / 78 Page
    날짜순 조회순 추천순
    • [ ● ESX 및 인텔 터보 부스트 및 ESXi에서 CPU 주파수를 확인하는 방법 ]
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 03.22 조회 13464 추천 0

    ●ESX 및 인텔 터보 부스트 및ESXi에서 CPU 주파수를 확인하는 방법-ESXi에서 CPU 주파수를 확인하는 방법esxcfg-info -w …

    • [ ● 작업실패_정보) DSM 7.1 DS918+, DS920+, DS1621+, DS3622xs+, DVA32… ]
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 04.27 조회 1 추천 0

    ● 작업실패_정보) DSM 7.1DS918+, DS920+, DS1621+, DS3622xs+, DVA3221,DS3615xs , DS3617x…

    • [ ● acme.sh 추가된 도메인 항목및 제거 명령 list remove ]
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 05.18 조회 4609 추천 0

    ●acme.sh 추가된 릴스트 도메인 제거 명령root@https11qkr:/usr/syno/etc/certificate/_archive# ac…

    • [ 실패● 작업주의)acme.sh를 이용한 ECDSA Wildcard SSL 인증서 발급받는 방법 ] 댓글 2
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 07.02 조회 5 추천 0

    ● 작업)acme.sh를 이용한 ECDSA Wildcard SSL 인증서 발급받는 방법(실패)장비 : 시놀로지 DSM 7.1 https://a…

    • [ ●메인 서버전환 성공) Xpenology boot loader ARPL로 전환 하기 ] 댓글 2
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 08.03 조회 8521 추천 0

    ●메인 서버전환 성공) Xpenology boot loader ARPL로 전환 하기 ARPL BOOT LOADER 적용을 위한 준비 내용 1. …

    • [ ● docker ubuntu 텔레그램메세지 보내기 에러 대응 및 epg m3u 생성 메세지 보내기 ] 댓글 3
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 11.11 조회 6796 추천 0

    ● docker ubuntu 텔레그램메세지 보내기 에러 대응 메세지발신 성공Cause and Fix for Wget 401 unauthorize…

    • [ ● 준비_시놀로지작업)wordpress site url 변경 ]
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 04.04 조회 17200 추천 0

    ●wordpress site url 변경https://www.lesstif.com/system-admin/wordpress-site-url-20…

    • [ ● 시놀로지 네트워크 인터페이스 변경 속도가 높은 LAN 포트로 변경 합니다. ]
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 08.16 조회 4608 추천 0

    ● 시놀로지 네트워크 인터페이스 변경속도가 높은 LAN 포트로 변경 합니다. 요즘 헤놀로지ARPL(Automated Redpill Loader)…

    • [ ● 시놀로지 web station 의 웹 서비스 포털 설정에서 호스트 이름을 입력 생성시 도메인 이름이 이미… ]
    등록자 11qkr 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 06.27 조회 2538 추천 0

    ●시놀로지 web station 의 웹 서비스 포털 설정에서 호스트 이름을 입력 생성시 도메인 이름이 이미 사용되고 있습니다시놀로지 web st…

    • [ [스크립] 특정페이지에 거는 간단한 로그인 창 스크립 | ]
    등록자 홈피관리자 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 10.09 조회 13532 추천 0

    ◎ 네이버에서 [https://11q.kr 홈피] 검색 찾아오세요 ◎원본 링크 참조 합니다제목 : [스크립] 특정페이지에 거는 간단한 로그인 창…

    • [ 매직 웹하드(MHard.net) ] 댓글 2
    등록자 홈피관리자 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 09.28 조회 14119 추천 0

    ♥http://mhard.net/wh_use/◎ 네이버에서 [https://11q.kr 홈피] 검색 찾아오세요 ◎ \n[이 게시물은 홈피관리자님…

    • [ 게시판이 밀려요 ]
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 02.16 조회 19377 추천 0

    .http://sir.co.kr/bbs/board.php?bo_table=g4_qa&wr_id=111159&sca=&sfl…

    • [ 모바일용 스킨 ]
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 08.30 조회 13305 추천 0

    .\r\n.\r\nShims HomePage\r\n[https://11q.kr 홈피] \r\n\r\n\r\nhttp://www.mozoki.co…

    • [ 게시판에 syntax highlight 적용하기 ]
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 09.17 조회 13843 추천 0

    게시판에 syntax highlight 적용하기관리자작성일시2010.03.23 19:30:20조회2,704댓글9http://alexgorbatc…

    • [ [배추빌더] 게시판에서 사진추가 버튼 클릭이 안됩니다. ]
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 10.10 조회 11947 추천 0

    \r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n곱슬최씨 2012-08-06 (월) …

    • [ 배추빌더 와 아미나 모바일 초기실행 안되는 문제 ]
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 01.04 조회 13847 추천 0

    배추 빌더와 아미나 모바일을 구현 할 방밥으로 배추빌더 설치 하고 아미바 모바일을\r\n설치 하였다\r\n초기 인덱스에서 \r\n.최신글 코맨트…

    • [ Jquery 이용해서 동영상 게시판 만들기~ ]
    등록자 shim11q.kr관리자 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 03.22 조회 13495 추천 0

    Jquery 이용해서 동영상 게시판 만들기~ \r\n. . Shims HomePage [https://11q.kr 홈피] .\r\n\r\n\r\…

    • [ 한 사이트를 빌더 2개 설치해서 사용하는게 가능할까요2 ]
    등록자 shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
    등록일 05.13 조회 11699 추천 0

    한 사이트를 빌더 2개 설치해서 사용하는게 가능할까요? 채택됨 무지개빛여신작성일시 2012.11.26 21:03:47조회 222 댓글 3 본문d…

    • [ 드롭다운 메뉴 (그룹 자동) - 그룹/게시판 제외 가능 그룹메뉴 5가지 색상입니다 /자동 그룹메뉴 아미나 접… ] 댓글 1
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 03.06 조회 15314 추천 0

    그룹메뉴 5가지 색상입니다 /자동 그룹메뉴 아미나 접목 xtx_topmenu.php..Shims HomePage[https://11q.kr 홈피…

    • [ 아미나 스킨 림스모바일 에 적용하기 ] 댓글 2
    등록자 11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물
    등록일 10.20 조회 16013 추천 0

    \r\n\r\n\r\n1) 림스 모바일을 설치 기본 설정 동작 확인 한다- config,php에 하나의 게시판 추가 하여 정상 동작 확인 림스 …


    ♥간단_메모글♥

    최근글

    새댓글

    PHP 안에 HTML ☞ 홈페이지 화면갱신 시간은 ♨
    ▶ 2024-07-01 08:43:08

    오늘의 홈 현황

    • 현재 접속자♨ 655 명
    • 오늘 가입자※ 0 명
    • 어제 가입자※ 4 명
    • 주간 가입자※ 12 명
    • 오늘 방문자 1,231 명
    • 어제 방문자 1,787 명
    • 최대 방문자 13,042 명
    • 전체 방문자 4,406,281 명
    • 전체 게시물※ 8,670 개
    • 전체 댓글수※ 24,801 개
    • 전체 회원수 11,078 명

    QR코드

    ☞ QR코드 스캔은 kakao앱 자체 QR코드
    알림 0








    최신글↑