히바리 쿄야 와 함께 하는 Developer Cafe
flat design 홈하위 메뉴 토글 버튼 플랫 디자인이란?하위 메뉴 토글 버튼 갤러리하위 메뉴 토글 버튼 문의사항하위 메뉴 토글 버튼 전체 메뉴 토글 버튼 플랫 디자인이란? 홈 / 플랫 디자인이란? 플랫 디자인 플랫 디자인은 평평함을 추구합니다. 플랫 디자인의 시초는 정확히 언제부터인지 알 수 없지만, 오래 전부터 전해져온 디자인 흐름인것은 분명합니다. 물론 플랫 디자인을 대세의 흐름에 서게 한 장본인은 있습니다. 바로 마이크로소프트의 윈도우8 UI입니다.마이크로소프트는 윈도우8에서 파격적인 플랫 UI를 발표하면서 플랫 디자인을 대중적인 디자인 흐름으로 만든 장본인입니다. 이에 따라 애플의 ios7에서도 플랫 디자인을 채택하면서 플랫 디자인의 자리가 굳건해지고 있습니다. 텍스트를 이용하는 방법 텍스트..
플렉서블 박스 기본설정 display : flex, inline-flex 모든 요소 flex : 박스를 블록 수준의 플렉서블 박스로 작동하게 한다. inline-flex : 박스를 인라인 수준의 플렉서블 박스로 작동하게 한다. 속성명 속성값 적용요소 flex-direction row(기본값), 플렉서블 박스 row-reverse, column column-reverse row : 박스를 왼쪽에서 오른쪽으로 배치, 해당 속성값으로 설정 할때 주축은 가로가 되고 교차축은 세로가 된다. row-reverse : 박스를 가로로 배치하되 역방향으로 배치, 오른쪽에서 왼쪽으로 배치한다. 해당 속성값으로 설정 시 주축은 가로가 되고 교차축은 세로가 된다. column : 박스를 위에서 아래로 배치, 해당 속성값으로 ..
반응형웹? PC , TV , 네비게이션 , 스마트 기기 등 기기마다 또는 환경마다 최적화 된 웹사이트를 제공해 주는것 http://mediaqueri.es -> 반응형 웹 사이트 참고할 만한 사이트 유지보수가 간편하고 모바일 점유율의 증가 마케팅에 유리하고 검색 엔진 최적화가 가능하기 때문에 반응형 웹을 많이 사용한다. - 미디어 쿼리 예제 - 가변 그리드 공식 (가변 크기로 만들 박스의 가로 너비 / 가변 크기로 만들 박스를 감싸고 있는 박스의 가로 너비) * 100 = 가변 크기의 % 값 100을 곱하는 이유 가변 크기의 박스는 %로 지정되기 떄문에 백분율로 표현하기 위해서 100을 곱한다. 가변 마진과 가변 패딩 (가변 마진을 적용할 마진값 / 적용할 박스를 감싸고 있는 박스의 가로 너비) * 10..