-
CSS 치트키 3) CSS Layout개발입문/WEB 2018. 1. 1. 16:19
Layout 레이아웃무엇을 어떻게 논리적으로 구성할 것인지 고민중요한 것은 중요하게! 숨길 것은 적당히 숨기고! 등을 구성하는건 중요하다.마치 학창시절 깔끔한 필기노트를 보는 것과 같다. (성적과는 무관하지만....)- 어디에 위치시킬 것인지,- 블락과 텍스트를 어떻게 (상대적으로) 위치/정렬 할 것인지 레이아웃 대상: ElementBlock-level Elements : full width available , - , , , , , Inline Elements : , , Display 노출여부주로 자바스크립트 코드를 안보이게 한다. display:noneh1.hidden { display: none; }h1.hidden { visibility: hidden; } Width 콘텐츠 크기 고정/반응형이제는..
-
반응형 웹 만들기 Day2개발입문/WEB 2017. 12. 30. 12:36
1. 목표: 그리드 / 레이아웃기기나 환경에 따라 레이아웃 (화면구성) 을 바꿀 수 있도록 2. 가변 그리드웹페이지를 제작할 때 화면의 크기에 관계없이 자유롭게 늘어나거나 줄어들 수 있도록 픽셀(px) 대신 퍼센트(%)로 제작하는 기술Fluid Layout, Flexible Layout, Flexible Grid 일반적으로 12개의 칼럼을 가진 테이블처럼 사용한다고 한다. https://www.w3schools.com/css/tryresponsive_grid.htm 3. 뷰포트모니터나 기기의 화면을 통해 보이는 영역 / 화면에 보이는 영역을 제어하는 기술PC: 해상도 / MO: 실제 기기의 화면크기 - 크기와 비율 제어 - The width=device-width 너비 = 디바이스의 화면크기 - The ..