2022. 5. 13. 17:55ㆍ나의 일상/- IT 리뷰
[CSS] :root 가상 클래스로 CSS 변수 다루기 (tistory.com)
[CSS] :root 가상 클래스로 CSS 변수 다루기
Html로 골격을 잡고 CSS로 디자인을 할 때, 폰트 크기나 폰트 컬러 등 여러 부분에 웹페이지의 통일성을 위해서 하나의 같은 변수를 여러 번 사용하는 경우가 많다. 수정을 해야할 때, 요소들을
designer-ej.tistory.com
이런글을 보았다.
정확히는 이 글이 아니었다. 디자인 시스템 라이브러리를 구축하려고 리서치 하던 중에 찾은 방법이다.
저 글은 21년도 작성되었지만 root 가상 클래스 자체가 그렇게 최신 기술인 것 까진 나도 모르겠다.
하여튼.
root 가상클래스를 이용해서 컬러와 텍스트 스타일 등을 지정해서 css파일에서 var()변수 지정해서 불러와서 쓰고 있었다.
그런데 SI프로젝트는 보통 윈도우를 기준으로 프로젝트를 진행한다는데 문제가 있었다.
아니 그것 보다는 브라우저 대응에 문제가 있다고 해야 더 정확하다.
처음엔 이 프로젝트는 window Edge 브라우져만 대응하는 걸로 결정 났었다.
디자인과 퍼블리싱까지 다 진행된 지금 대응할 브라우저가 변경되었다.
Internet Exproler 를 대응 해야 한다는 것....!!
이러면 문제가 뭐냐면
IE 브라우저에서는 부트 스트랩이같은 라이브러리나 최신 css, jquery 들을 대응 안해주기 때문에 열심히 디자인하고 작업한 페이지가 깨져보인다. ㅠㅠ
이럴수가.. 중간에 바뀌는것도 별론데, 이렇게 모든 디자인, 퍼블리싱 등이 지원이 안되는 IE브라우저를 금융권에서는 대부분 써야 한다는 사실 자체가 제일 별로다.
지금은 2022년도라구..
아무리 보안이 중요하다지만 이건 좀..
IE 브라우저를 유투브도 지원안하고 머 어디더라 요즘은 지원 안하기로 결정한 웹서비스들이 한 80%정돈 되는걸로 알고있다. 넘 높여서 말했나?
결론은 지정해놓은 root와 css에 var() 변수 지정해놓은 것 모두 일일히 검색해서 지우고 일일히 컬러값, 폰트 세팅값 입력해줘야한다..
'나의 일상 > - IT 리뷰' 카테고리의 다른 글
[피그마] 여러장의 이미지를 각기 다른 크기로 가져오기 (0) | 2024.11.25 |
---|---|
피그마 폰트오류 누락 해결방법 (0) | 2024.03.19 |
파이널컷 , 애프터 이펙트 오류 모음 (0) | 2022.04.09 |
디즈니 플러스+ 설치했습니다 | 국내런칭 가입방법 요금 추천작 (0) | 2021.11.13 |
애플워치 솔로루프 후기 (0) | 2021.01.30 |