티스토리 툴바


블로그 이미지
카라크라스

Leon.Kim의 공부하는 블로그입니다. mail - kalaklas@gmail.com twitter - @kalaklas

Rss feed Tistory
분류없음 2011/02/15 10:31

* CSS 상속관계 정의시 주의사항

보다 구조적으로 Content를 설계 개발함에 있어 
css는 개발시점에는(build과정을 통하여 하나의 css파일로 통합되기 이전의 시점 . . .) 각자의 용도에 맞게 서로 독립적이어야
한다 .

예를 들어 버튼위젯, 슬라이더위젯, 텍스트필드위젯등(독립적으로 개발되어진 . .)이 사용되는 main.html(main.css, button.css, slider.css, textfield.css) 이란 페이지가 있다 할때 . . . . . UI위젯들은 각각 자신들을 표현하는 css를 보유하고 있을것이다.

main.html 페이지를 표현하기 위한 main.css button.css, slider.css, textfield.css 는 
등 최소 4개의 독립적인 css가 필요할텐데 . . .

main.css 의 내용은 아래와 같을 것이다.

더보기


이렇게 구조화 하면 main.html페이지에서는 간단히 main.css만 require하면 된다.(개발 시점을 두고 나누는 이야기~~*)

>> 개발이 모두 완료된 후 빌드하는 시점에는 main.html 을 위한 main_min.css 에 main.html을 위한 모든 css가 통합 최적화

해야하는데 . . .  툴이 많이 존재(예를 들면 . . . shrinksafe같은 . . .) 


무튼 개발시점에 이런식으로 css간 상속(?)의 관계가 정의되는데 . . . 간단한 개발에서는 큰 문제가 없을테지만 . . . 

Page UI가 복잡해지고 . . . 쓰이는 요소가 많아질수록 복잡도가 증가하며 . . . css 간 상속 레이어가 발생하게 된다 . . . .

이때 IE에서 아래와 같은 문제들이 발생하였다.


요걸 설명하려고 . .  쓰잘대기 없이 위에 저렇게 줄줄이 주절거렷다 . . .

중요한(?) 내용이니 까먹지 말아야 겠다.


  *CSS파일간 상속 관계 정의시 주의사항
 IE에서 발생하는 문제
 1.css 한파일에서 import 할수 있는 갯수에 제약이있다 (약 30여개)
 2.import depth가 4단계 이상되면 import못한다.
TOTAL 19,751 TODAY 3