728x90 반응형 전체 글298 [HTML5] html lang 속성 웹접근성 요소 중 하나 스크린리더가 en의 경우 영어 그대로 읽어주고, ko의 경우 영어를 해석해서 읽어준다. 2019. 4. 8. [HTML5] 반응협웹을 구현하기위한 메타태그 뷰포트 모바일 우선! viewport를 선언하지 않으면 미디어쿼리로 반응형 웹으로 제작하더라도 모바일 기기에서 제대로 작동하지 않음 * width 가로 크기 - 숫자로 크기를 지정할 수도 있음 - device-width 로 값을 지정할 경우 기기의 화면 크기에 맞춰짐 height=device-height 값으로 세로크기의 비율도 지정할 수 있음. * initial-scale 로드되었을 때 줌 레벨 1.0 (= 100%) * maximum-scale 최대 줌 레벨 지정 기본값 0.25 * minimum-scale 최소 줌 레벨 지정 기본값 1.6 * user-scalable 확대축소 가능한지 yes, no 값으로 지정 기본값 yes no값으로 설정하면 input영역 선택시 확대되는 것을 막고, 사용자가 화면을 확.. 2019. 4. 8. [CSS3] 반응형 웹 미디어 쿼리 (@ media) CSS파일은 순서대로 적용되므로 미디어쿼리는 css파일 제일 하단에 위치해야 합니다. 또한 html에 반응형 뷰포트도 써줘야합니다. @media (max-width:1024px){ //브라우저 크기가 1024이하일 때 //태블릿 또는 노트북 } @media (max-width:768px){ //브라우저크기가 768이하일 때 //태블릿 또는 스마트폰 } @media (max-width:320px){ //브라우저 크기가 320이하일 때 } ================================= @media (min-width:320px){ //브라우저 크기가 320 이상일 때 // 스마트폰 또는 태블릿 } @media (min-width:768px){ //브라우저 크기가 768 이상일 때 //태블릿 또.. 2019. 4. 8. [JAVASCRIPT/JQUERY]반응형 탭메뉴 (웹에서는 탭메뉴 - 모바일에서는 셀렉트메뉴) 탭메뉴를 반응형으로 구현하는 방법 중 하나입니다. 화면이 작아지는 모바일에서 탭메뉴는 한줄로 표현하기 어려워 집니다. jQuery 를 이용해 탭메뉴를 선택했을때 셀렉트 메뉴 선택 option 도 달라지도록 설정해 큰화면으로 보다가 화면이 줄어들어 탭메뉴에서 select 로 변경되어도 선택한 메뉴가 유지되도록 합니다. 모바일에서는 select 형태로 보이고 웹에서는 tab 메뉴 형태로 보입니다. See the Pen 반응형 탭메뉴 by gahyun (@gahyun) on CodePen. 또다른 반응형방법 [CSS/CSS 응용] - [CSS]한줄로 길게 늘어트리기 (가로로 스크롤 되도록) 2019. 4. 8. 이전 1 ··· 70 71 72 73 74 75 다음 728x90 반응형
