CSS에서 색상 코드 대신 색상 이름을 사용하는 데 단점이 있습니까?
예를 들어 쓰기 red가 #cc0000. 문자가 적고 공간을 덜 차지하며 기억하기.
16 진수 코드 또는 RGB 값보다 색상 이름 을 사용 하는 데 단점이 있습니까? 여기에는 다중 개발자 환경에서의 프로그래밍이 포함됩니다.
다른 브라우저는 일부 색상 이름의 의미에 동의하지 않을 수 있습니다. 모든 1600 만 24 비트 색상에 대한 이름은 없습니다. 실제로 W3C 표준 색상 이름은 17 개뿐입니다. 재미있게도 괜찮을 것입니다.
개인적으로 빌드시 템플릿 시스템을 사용하여 CSS 파일을 사전 처리하는 표준 사이트 색상 세트를 유지하고 이름으로 참조 할 수 있습니다. 이렇게하면 두 가지 장점을 모두 얻을 수 있습니다. RGB 색상 값이 무엇을 선택하고 CSS에서 더 간단한 이름을 사용할 수 있습니다.
(물론, 특정 사용자의 브라우저에서 색상이 어떻게 보이는지 정확히 알 수는 없습니다 .)
편집 — 5 년 동안 덜 및 Sass와 같은 전처리 기가 매우 보편화. CSS 소스에서 색상 (및 기타 여러 가지)을 관리하기위한 매우 정교한 도구를 제공합니다.
W3C 권장 사항을 따르는 것이 좋습니다.
이들 모두 (CSS 레벨 1, 레벨 2 및 레벨 3)은 색상 사용이 완벽하게 이름은 사양에 따라 허용되는 색상 색상 지원됩니다.
CSS1 사양
CSS1 사양 은 16 진수 코드 및 RGB 코드에 대한 유효한 대체물로 색상 이름 을 사용할 것을 권장합니다 .
6.3 색상 단위
추천 키워드 색상 이름 목록은 아쿠아, 블랙, 블루, 퓨샤, 그레이, 그린, 라임, 적갈색, 네이비, 올리브, 퍼플, 레드, 실버, 청록, 화이트, 옐로우입니다. 이 16 가지 색상 은 Windows VGA 도구에서 가져 와서 RGB 값은 사양에 정의되어 있습니다.
CSS2 사양
이제 색상 이름을 사용할 수 있습니다 orange! 투표는 최대 17 색 입니다. 참조 용 CSS2 사양 .
CSS3 및 X11 색상
CSS3를 사용하면 SVG 1.0의 X11 색상 을 CSS의 속성 (및 hsl()값)에서 사용할 수 있습니다. 이렇게하면 색상 이름의 양이 147 색으로 확장 됩니다. 이러한 색상 이름은 IE9 이상인 SVG 1.0 사양을 지원하는 모든 브라우저에서 사용할 수 있습니다 .
이것은 또한 질문에 대부분의 색상 목록이 대부분 유효하지 않습니다 .
권장 사용법
레거시 브라우저를 지원하려는 경우 X11 색상이 지원되지 않습니다. 웹 안전 원래 색 이름을 사용하십시오. X11 사양에 지정된 147 개의 색상 이름을 자유롭게 사용할 수 있습니다.
모든 브라우저는 동등한 16 진 코드를 참조하여 사양을 준수해야합니다. 16 진수 값, rgb 값 또는 hsl () 값을 사용하는 것과 같습니다.
나 보유한 HEX 코드를 소문자로 작성하는 것이 더 판독합니다. 예를 들어 # 8b88b6은 # 8B88B6보다 분명히 더 읽을 수 있습니다. 또한 더 많이이기 때문에 전체 코드 (# 666666 대신 # 666) 대신 속기 HEX 색상을 사용하는 경향이 있습니다.
개인적으로 저는 두 가지 사실을 16 진수 코드를 사용하는 것을 선호합니다.
- Photoshop에서 16 진수 코드를 복사하는 것이 더 있습니다.
- 스타일 시트 전체에 16 진 코드를 사용할 수 있습니다 (16 진 코드 및 색상 이름)을 혼합해야합니다. 따라서 스타일 시트가 더 이상 일관 될 수 있습니다.
이것은 당신이 단순한 빨강, 검정, 흰색 등의 다른 색상을 사용하고 가정합니다. 다중 개발자 환경에서는 16 진수 코드가 더 보편적으로 일관 적이기 때문에 더 좋습니다 (모든 개발자는 색상이 정확히 무엇인지 알고 있습니다).
이전 답변은 지금까지 구식으로.
IE9 이후 모든 주요 브라우저 인 CSS3를 지원하는 브라우저 용으로 개발하는 경우 CSS에서 색상 이름을 사용할 수 있습니다. HTML에서는 16 개의 원래 원래 웹 색상 만 지원됩니다.
문제는 문제점이 있는지 여부. 몇 가지가 많은 생각합니다.
- 색상 이름 중 일부가 잘못되었습니다. 예 :
- Azure는 일반적으로 훨씬 더 어두운 색상으로 처리됩니다.
- 잔디 녹색은 내가 본 잔디와는 전혀.
- 바이올렛은 내가 핑크라고 부르는 것과 더 비슷해 보입니다.
- 16 진수 값을 변경하여 색상을 약간 더 어둡거나 밝은 버전으로 만드는 것이 더 어렵습니다. 예를 들어, #DCDCDC의 더 어두운 변형은 #DADADA가 될 것이지만 색상 이름 gainsboro로 시작되는 전혀 알 수 없습니다.
- 자바 펼쳐 계산은 이름에 대해 더 어렵습니다.
출처 : https://developer.mozilla.org/en-US/docs/Web/CSS/color_value 및 http://caniuse.com/#search=css3%20colors
#c00빨간색 에 대한 추가 최적화를 선호합니다 . 기본 색상 #aabbcc또는 사용 가능한 색상을 사용 하려는 경우 속기, 사용할 수 있습니다 #abc.
저는 새로운 타이핑, 양식, 그리고 하이퍼-특정 16 진수 색상으로 테마를 정할 수있는 매우 기본적인 색상 구성표를 설정하기 위해 색상 이름을 사용합니다. 테마 가능 속성을 쉽게 사용할 수 있습니다. 또한 사람이 더 읽을 수 있습니다. 어떤 일이 일어나고 있는지 알아보세요.
.component {
background-color: black;
color: white;
}
... 테마 파일에서 ...
.some-theme .component {
background-color: #5f5f5c;
color: #fafafc;
}
당신은 당신의 코딩 스타일에 달려 있습니다. 일관성을 위해 16 진수 값을 고수합니다. 색상은 항상 #000또는 형식이 지정되고 #000000namd 색상과 이름없는 색상간에 전환하는 것에 대해 걱정할 필요가 없습니다.
결국 그것은 당신과 당신의 팀이 스스로 결정해야 할 것입니다. 그것은 당신의 선호에 관한 것입니다.
개인적으로 가능한 경우 CSS 파일의 색상을 방식대로 정의하는 것을 선호합니다.
내가 정의 된 다른 색상 참조 (예를 때 내가하지 않아도 그런 식으로 다른 방식으로 생각하는 red, #cd876f그리고 rgba(255,255,0,0.4)).
또한 구현중인 디자인에서 색상을 식별 할 때 표시되는 것과 일치하는 색상 표기법을 선호합니다. Photoshop의 색상 팔레트는 RGB 및 16 진수 값을 제공하지만 CSS 색상 이름은 제공하지 않습니다. (다른 디자인 도구도 가능합니다.)
색 이름이 좀 더 설명 적이라고 생각합니다. 이것이 가능할 때 사용하는 좋은 이유입니다.
제 생각에는 선호도의 문제입니다. 색상이 빨강, 검정, 회색, 파랑, 흰색 등과 같이 단순한 경우 16 진수 대신 단어를 사용합니다.
'ProgramingTip' 카테고리의 다른 글
| JSON 텍스트는 최소한 두 개의 옥텟을 포함해야합니다. (0) | 2020.11.25 |
|---|---|
| 왜 — yaml 파일에서 (3 개의 대시 / 하이픈)? (0) | 2020.11.25 |
| JUnit 테스트 케이스에서 자원 파일을 제거 수 없음 (0) | 2020.11.25 |
| OwinStartup시 DI 컨테이너 사용 방법 (0) | 2020.11.25 |
| For 루프에서 포크 () (0) | 2020.11.25 |