답변:
CSS 프레임 워크는 실제로 프레임 워크가 아니기 때문에 약간 까다 롭습니다. 그들은 단순히 사전 정의 된 클래스입니다. 그러나 이것은 귀하의 질문이 아닙니다.
CSS 프레임 워크는 목업 및 와이어 프레임에 적합합니다. 태그에 의미없는 클래스를 추가하기 때문에 라이브 사이트에서 사용하지 않는 것이 좋습니다. ".span3"은 내용에 대해서는 아무 것도 말하지 않고 디자인 만 알려줍니다.
그러나 블루 프린트에는 프레임 워크 클래스와 시맨틱 클래스를 한 번 결합하는 데 도움이되는 멋진 도구가 있습니다.
나는 항상 내 CSS를 굴린다.
그냥 피하십시오, 그들은 귀찮은 것입니다.
특히 이것.
* { margin:0; padding:0; }
가장 큰 불만은 재설정 및 / 또는 프레임 워크를 사용하는 사이트를 상속 / 유지 관리하는 경우 사이트를 수정하기 전에 해당 프레임 워크를 알아야한다는 것입니다.
h1 태그를 추가하면 특정 사항이 필요합니다. 대부분의 재설정은 h1 태그가 더 이상 기본적으로 더 이상 작동하지 않도록 모든 패딩, 여백, 블록 등을 제거합니다. 그래서 돌아가서 처음에 있던 모든 것을 추가해야합니다.
일반적으로 (제 경험상) 재설정 및 프레임 워크를 사용하는 CSS를 이해하지 못하는 사람들은 더 많은 일을합니다.
* {margin:0; padding:0;}
가장 중요한 CSS 재설정입니다. margin-top/maring-bottom
태그를 포함하여 모든 태그에서 제거 p
하므로 각 줄 사이에 큰 공간이 표시되지 않습니다. 이 웹 사이트조차도 p {margin:0;}
그렇지 않으면 브라우저가 각 줄 사이에 큰 공간을 차지할 것입니다. 나는 그들이 당신이 성가 신다고 말할 수 있는지 궁금합니다.
Eric Meyer의 reset.css를 사용하는 것이 좋지만 CSS "frameworks"가 레이아웃에 도움이 될 수 있다고 생각합니다. Blueprint, YUI 그리드 및 960-grid를 사용하면 CSS를 직접 작성하지 않고도 매우 복잡한 레이아웃을 얻을 수 있습니다.
언급 된 단점이 있지만, 예를 들어 사용자 지정 코드를 롤링하는 대신 CMS에서 웹 사이트를 구축하는 것에 대해서도 마찬가지 일 수 있지만 여전히 유용 할 수 있으며 많은 사이트에서 얻은 이점은 외부 CSS 또는 성능 문제보다 중요합니다.
실제로 자신의 디자인을 구현하는 경우 다른 사람이 원하는 정확한 디자인을 작성하지 않은 한 자신의 CSS를 작성합니다.
CSS를 직접 작성한다고 가정하면 다음과 같은 스타일이있을 때“frameworks”가 유용 할 수 있습니다.
정말 간단 스타일의 경우, 표시하는 클래스를 사용하는 것이 좋습니다 것 (예를 들면 무언가가 class="navigation"
), 다음 스타일 시트 클래스에 스타일 규칙을 적용하여 그 모양을 정의합니다.
그러나 하나의 요소 (예 : 레이아웃 관련 스타일, 프레임 워크에서 이름을 지정하는 유형)와 관련이없는 복잡한 스타일 .span3
의 경우 클래스에 배치하고 해당 클래스를 CSS에 적용하는 데 아무런 문제가 없습니다. 두 가지 방법을 함께 사용할 수 있습니다.
요소가 예측할 수없는 방식으로 결합 될 수있는 더 크고 복잡한 사이트에서 프레임 워크와 유사한 접근 방식은 실제로 코드를 관리 할 수 있도록 도와줍니다.
그래도 자신 만의 "프레임 워크"를 작성할 수 있다고 말하고 싶습니다. CSS는 그다지 큰 언어가 아니기 때문에“프레임 워크”를 따옴표로 묶었습니다. CSS : Definitive Guide (Eric Meyer)를 하루에 읽은 다음 Blueprint (CSS "프레임 워크")의 모든 코드를 읽고 진행 상황을 거의 이해할 수 있습니다. IE 해결 방법을 조금 연구해야 할 수도 있지만 여기서는 jQuery와 같이 복잡도를 최소한으로 줄였습니다.
CSS에는 청사진을 사용합니다.
CSS는 위의 모든 사람들이 말했듯이 정말 간단합니다.
그러나 실제로는 플랫폼을 고려해야합니다.
CSS를 사용하면 렌더링 엔진이 복잡성을 더합니다.
Gecko vs WebKit vs Presto vs Trident ... 누가 그 모든 것을하고 싶습니까?
여기서 '프레임 워크'가 제공하는 것은 모든 브라우저에서 작동 할 수있는 레이아웃을 작성하는 기능이므로 'WTF-am-I-doing = -this-crap'IE 7 quirksmode에 대해 인터넷 검색을 할 필요가 없습니다. 고치거나 비슷한 소리로 말이다.
프레임 워크는 원하는 레이아웃의 90 %를 수행하며 나중에 언제든지 자신 만의 스타일을 추가 할 수 있습니다.
따라서 질문에 대답하기 위해 프레임 워크를 선택하고 그것이 효과가 있는지 확인하십시오. 그럴 수도 있습니다. 그렇다면 당신은 황금색이며, 당신이 실제로하고 싶은 것으로 돌아갈 수 있습니다. 그렇지 않은 경우 CSS를 사용하여 확장하고 작동하지 않는 것을 변경하십시오. 그렇게하면 크로스 브라우저 이점을 유지하면서도 사용자 정의 할 수 있습니다.
작은 혜택으로, 하나를 골라서 항상 사용하고 나서 병에 걸리거나 승진하여 후임자를 훈련시켜야하는 경우 다음과 같이 말할 수 있습니다.
"예, 프레임 워크 ABC를 사용했습니다. 문서는 여기에 있습니다. 코드는 있습니다. 교육은 끝입니다. 행운을 빌어 요."
그것이 당신의 모든 요구를 해결할 때 . (이것은 조정 의 아이디어에 근거합니다 .)
프레임 워크에 관한 유일한 책에서? http://www.oreilly.com/web-platform/free/book-of-html-css-frameworks.csp . (여기서는 무료이며 관련성이 있으므로 연결 만 가능합니다.)