어디에서나 바로가기 기능을 사용하실 수 있습니다. 주메뉴 이동은 알트 키 플러스 1 키이고, 부메뉴 이동은 알트 키 플러스 2 키이고, 본문 이동은 알트 키 플러스 3 키입니다. 알트 키 플러스 J 키는 일반모드와 텍스트모드로 전환합니다.

현재위치
  1. HOME
  2. >배우기
  3. > 스타일시트(CSS)

본문 영역

반응형 기타 상세보기

작성자: 관리자 추천: 0  조회: 3544

반응형 기타


기기별 보기


/* 기기별 보기 */ .only-web{display:block;} .only-web-inline{display:inline-block;*zoom:1;*display:inline} .only-tablet{display:none} .only-tablet-inline{display:none} .only-mobile{display:none} .only-mobile-inline{display:none} .not-web{display:none} .not-web-inline{display:none} .not-tablet{display:block;} .not-tablet-inline{display:inline-block;*zoom:1;*display:inline} .not-mobile{display:block;} .not-mobile-inline{display:inline-block;*zoom:1;*display:inline} /* 타블렛 취급 */ @media screen and (max-width:768px){ .only-web{display:none} .only-web-inline{display:none} .only-tablet{display:block;} .only-tablet-inline{display:inline-block;*zoom:1;*display:inline} .not-web{display:block;} .not-web-inline{display:inline-block;*zoom:1;*display:inline} .not-tablet{display:none} .not-tablet-inline{display:none} } /* 모바일 옆으로 보기로 취급 */ @media screen and (max-width:683px){ .only-tablet{display:none} .only-tablet-inline{display:none} .only-mobile{display:block;} .only-mobile-inline{display:inline-block;*zoom:1;*display:inline} .not-tablet{display:block;} .not-tablet-inline{display:inline-block;*zoom:1;*display:inline} .not-mobile{display:none} .not-mobile-inline{display:none} }

위 코드의 단어를 보면 only, web, tablet, mobile, inline, not의 조합으로 이루어져 있습니다.
기기별 단어는 web, tablet, mobile입니다. web은 PC(컴퓨터)를 나타내며, tablet은 타블렛PC를, mobile은 모바일(스마트폰)을 나타냅니다.
only는 "오직"의 뜻을 나타내며, not은 사용안함을 나타냅니다.
inline은 block형태가 아닌 글자형태라는 뜻입니다. 화면에 표시되는 형태는 크게 블록(block)형과 인라인(inline)형으로 나뉩니다. div,table 등이 블록형이고, 글자와 이미지 등은 인라인형입니다. 글자와 이미지를 기기별 보였다가 감추었다하고 싶을 경우 inline형태로 사용하세요.

블록형태는 한줄 전체를 사용하고, 인라인형태는 한줄 안에 있는 것입니다.

표 제목
코드 설명 기타
only-web PC PC에서만 출력
only-web-inline PC PC에서만 출력(글자형태)
only-tablet 타블렛PC 타블렛PC에서만 출력
only-tablet-inline 타블렛PC 타블렛PC에서만 출력(글자형태)
only-mobile 모바일 모바일에서만 출력
only-mobile-inline 모바일 모바일에서만 출력(글자형태)
not-web 타블렛PC,모바일 PC 출력안함
not-web-inline 타블렛PC,모바일 PC 출력안함(글자형태)
not-tablet PC,모바일 타블렛PC 출력안함
not-tablet-inline PC,모바일 타블렛PC 출력안함(글자형태)
not-mobile PC,타블렛PC 모바일 출력안함
not-mobile-inline PC,타블렛PC 모바일 출력안함(글자형태)

TOP

등록일:
마지막 수정일:
답변
목록

스타일시트(CSS)

총글수: 12
스타일시트(CSS) 목록 : 이표는 글순서,첨부파일,제목,추천수,조회수,작성일을 확인할 수 있습니다
글순서NO *(첨부파일) 제목 추천 조회 작성일↑
12 없음 레이아웃 구조 추천:0 조회:5684
11 없음 색상표 추천:0 조회:5422
10 없음 버튼 추천:0 조회:8966
9 없음 하이라이트 추천:0 조회:4791
8 없음 인용구 추천:0 조회:3478
7 없음 테이블(표) 추천:0 조회:3669
6 없음 박스 리스트 추천:0 조회:4059
5 없음 텝박스 추천:0 조회:4276
4 없음 아이콘 추천:0 조회:6622
3 없음 현재글:반응형 기타 추천:0 조회:3544
초기화 
스타일시트(CSS) 검색