글 전체보기 453

그리드(Grid) 디자인에 유용한 그리드 시스템 웹사이트

웹사이트 레이아웃 디자인 작업 시에 필요한 그리드 디자인 웹사이트들.fluid design, Adaptable design에 관심 있거나 CSS로 그리드를 일정히 나눠 레이아웃 작업을 할 때 참고하기 좋은 웹사이트들이다. 1. http://960.gs/ 오래된 컴퓨터 해상도 1024 포함 해 최적으로 보여주는 960 Grid 2. http://978.gs/ 978px 로 설정하여 레이아웃을 잡는 그리드 시스템 3. http://cssgrid.net/ 해상도 1280 모니터에 최적으로 작업 된 1140 grid.

Div와 CSS에 대한 간단요약

(1) 원인 : 왜 Table을 사용하지 않고, div+css로 하는가?  링크 따라가기 : 레이아웃과 스타일을 따로 분류해서 보기 편하고 유지하기 쉽도록 제작하기 위해서: 퍼포먼스에서 table보다 훨씬 빠르며, 값싸다 (외국에서는 바이트로 값을 낸다나)div : division - 구역, 구분, 분할 / div로 집의 골조를 만든다CSS : 스타일 시트 / div로 만든 집에 색을 입히고 가구를 들여놓는다.(2) 스타일 지정방식 : CSS을 div에 첨부하는 방식 (작은범위에서 큰범위순으로)1. 직접 스타일 지정하는 inline Style방식 - 이건 혼자만 쓸 수 있다.2. 사이에 들어가는 internal Style - 해당 파일 내 에서는 쓸 수 있다.3. 외부 링크 External Style -..

Google web font site 이용하기

구글 웹폰트를 이용하는 방법은 다음과 같다. 1. 사용방법은 두가지가 있다. @import를 이용하기링크를 사이에 걸어 사용하기 우리가 밑의 파일을 만들었다고 가정한다. View.html - 화면을 보여줄 페이지 이름Style.css - 스타일을 적용할 스타일시트 가 있다고 가정하고 어떻게 적용하는지 알아본다. 구글 웹 폰트 바로가기 :http://www.google.com/webfonts# 구글에서 웹 폰트를 사용하는 방법은 선택 > 리뷰 > 사용 이렇게 세가지로 먼저 사용할 폰트를 고른 후 리뷰, 사용 페이지에서 소스를 얻어오는 방식이다. 1. @import를 이용하기. 간단하게 @import url를 사용하여 CSS파일에 불러오는 방식이다. Style.css 파일에 작성한다. 그 후 Style.cs..