유동 레이아웃이란 무엇입니까?
https://stackoverflow.com/questions/62334
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian문제
내 디자이너는 "액체" 레이아웃이라는 용어를 계속 사용하고 있습니다.이것은 무엇을 의미 하는가?
설명해 주셔서 감사합니다. 저는 항상 이것을 백분율 레이아웃이라고 불렀고 그가 조각을 이동할 수 있다고 말하는 줄 알았는데 그게 유동적이었습니다.
해결책
"유동적" 레이아웃은 브라우저 창 크기가 조정될 때 사용 가능한 전체 영역을 채우도록 확장되는 사이트 레이아웃입니다.일반적으로 이는 CSS를 사용하여 수행됩니다.유동 레이아웃은 특정 유형의 사이트에 매우 유용할 수 있지만 고정 너비 레이아웃보다 훨씬 더 많은 노력이 필요한 경향이 있으며 유용성은 사이트 콘텐츠와 얼마나 잘 구현되었는지에 따라 달라집니다.
다른 팁
에서 http://www.maxdesign.com.au/presentation/liquid/ :
페이지의 모든 컨테이너에는 폭이 퍼센트로 정의되어 있습니다. 즉, 초기 포함 블록이 아닌 뷰포트를 기반으로합니다.브라우저 창 크기를 조정하면 액체 레이아웃이 들어오고 나옵니다.
기본적으로 이는 페이지 요소에 대한 특정 너비 사양에 의존하지 않는 웹 페이지의 레이아웃입니다.
다음에서 토론을 참조하세요. 위키피디아.
이는 사용 가능한 모든 화면 공간을 효율적으로 사용하기 위해 브라우저(또는 클라이언트)의 너비와 높이에 동적으로 조정되는 레이아웃을 의미합니다. 이는 해당 특정 항목의 공통 분모 해상도에 맞게 만들어진 (주로) 고정 너비 레이아웃과 반대입니다. 시간(예:800x600은 수년 동안 웹사이트의 표준이었습니다.
유동적 레이아웃은 웹사이트의 디자인 컨셉을 나타냅니다.유동 레이아웃은 CSS에 백분율과 상대 너비가 있기 때문에 브라우저 창 크기를 조정할 때 안팎으로 이동합니다.
이는 작업이 제대로 수행되면 특정 지점까지 브라우저의 창 크기(일반적으로 너비)를 채우기 위해 축소/확장된다는 의미일 뿐입니다.그렇지 않으면 대형(24인치 이상) 모니터에서 텍스트를 읽기가 매우 어려울 수 있습니다.
둘 중 하나:
디자인은 브라우저의 너비에 맞춰 조정됩니다(예를 들어 브라우저의 너비가 1024px인 경우 디자인도 마찬가지입니다).100px 너비 브라우저용으로 디자인할 때는 꽤 재미있습니다(디자이너가 실제로 최소 너비를 설정하는 경우도 있습니다).
디자인의 너비는 고정되어 있지만 상대적인 크기를 사용하여 측정값으로 설정됩니다.예를 들어 "em"...글꼴 크기가 커지면 페이지 너비도 늘어납니다.
유동 레이아웃은 모든 너비를 백분율로 정의하는 CSS 레이아웃 방법이므로 뷰포트(브라우저 창)의 크기를 조정할 때 페이지 영역이 커지거나 줄어듭니다.
큰 화면과 작은 화면 모두에 맞는 사이트를 만들려고 할 때 매우 유용합니다.고정 레이아웃보다 작업하기가 조금 더 어렵습니다. 페이지에 모든 것이 어떻게 들어가는지에 대한 어느 정도 수준의 제어를 포기하고 내용이 떨어지지 않도록 콘텐츠에 세심한 주의를 기울여야 하기 때문입니다. 크기 조정 시 미학적으로 분리됩니다.
유동적 레이아웃은 매우 기본적인 열 레이아웃을 갖춘 텍스트가 많은 사이트에 가장 유용하다고 말하고 싶습니다.또한 유동 영역과 고정 영역이 모두 있는 '탄력적' 레이아웃을 갖춘 적합한 매체를 찾을 수도 있습니다.
진정한 Liquid 레이아웃에서는 의미 있고 계산적이며 지능적인 방식으로 콘텐츠가 사용자의 브라우저 창에 맞게 확장 및 축소됩니다.따라서 열과 컨테이너 너비를 백분율로 설정하는 것 이상입니다.
잘 수행하면 인지된 품질이 향상될 수 있습니다.제대로 수행되지 않으면 유용성의 악몽입니다.
Going Liquid는 엉덩이에 엄청난 고통을 줍니다.사이트를 구축하려는 주제/클라이언트/제품이 시각적 품질이 뛰어나거나(여름 블록버스터 영화 사이트 등) 특정 핏과 마감이 필요하거나 표시가 필요한 경우 고통은 그만한 가치가 있습니다. 큰 덩어리의 데이터.
메모:나중에 내 주장에 대한 좋은 사례와 인용 링크를 업데이트하겠습니다.
