2012-12-14 18 views
12

Dlaczego żadna przeglądarka nie może zastosować tej reguły kolorów rgb?Dlaczego "rgb (224, 226, 213)" jest niepoprawną wartością właściwości?

HTML

<header> 
    <h1>Header</h1> 
</header> 

CSS

header h1 { 
    background-color: red; 
    color: rgb (224, 226, 213); 
} 

Chrome Web Developer Tools mówi mi, że jest to nieprawidłowa wartość nieruchomość, ale nie mogę zrozumieć, dlaczego. Możesz zobaczyć wynik w JSFiddle.

+0

Istnieje przestrzeń po rgb – Esailija

+6

Chociaż jest to pytanie o literówkę, nie sądzę, że "jest mało prawdopodobne, aby pomóc przyszłym czytelnikom". Jest to dość powszechne poczucie, a ja sugeruję tak wiele w mojej odpowiedzi. – BoltClock

Odpowiedz

28

mieć przestrzeń pomiędzy rgb i (, który nie jest dozwolony:

header h1 { 
    background-color: red; 
    color: rgb(224, 226, 213); 
} 

Nie, mówię poważnie, to nie jest.

W przeciwieństwie do wielu języków programowania, CSS wyraźnie zabrania odstępów między nazwą funkcji a nawiasem otwierającym. Dotyczy to nie tylko rgb() i rgba(), ale także innych wartości funkcjonalnych, takich jak url() i attr(), a także funkcjonalnych pseudoklasy, takich jak :nth-child(), :lang() i :not().

Patrz section 4.3.6 of CSS2.1, który stanowi:

Format wartości RGB w notacji funkcjonalnej to RGB ("następnie oddzielone przecinkami trzech wartości liczbowych (pochodzące z trzech liczb całkowitych lub trzy wartości procentowe), a następnie ")". [...] Białe znaki spacji są dozwolone wokół wartości numerycznych.

a także zapoznać się z Appendix G do gramatyki, właśnie następującym tokeny, który wyraźnie pokazuje, że spacje nie należy się spodziewać między identyfikatorem i nawiasem otwierającym:

{ident}"("  {return FUNCTION;} 
+2

Było to dla mnie zaskoczeniem, ale składnia CSS 2.1 tak naprawdę definiuje notacje funkcji w ten sposób, a nawet opis prozaiczny 'rgb (...)' czyni to jasnym (a także wyraźnie mówi, że spacje są dozwolone wokół liczby, sugerujące, że w przeciwnym razie spacje nie są dozwolone w zapisie). –

+2

Najprostszym sposobem rozwiązania takich błędów jest ich sprawdzenie. Możesz zweryfikować swoje css w walidatorze W3C (http://jigsaw.w3.org/css-validator/#validate_by_input). –

+0

Podczas gdy weryfikator Jigsaw może wykryć błędy dla ciebie, notorycznie niewiarygodne jest pokazywanie ci * naprawiania * ich. Na przykład w rzeczywistości nie oznacza to, że przyczyną problemu jest obecność przestrzeni (ponieważ nie * widzi * przestrzeni jako problemu na początku). I komuś, kto jest przyzwyczajony do języków programowania, pozwalając na spacje, nie będzie to od razu oczywiste. Punkty bonusowe, jeśli pytający rzeczywiście przeprowadzili swoje kody CSS przez układankę, zanim opublikowali swoje pytanie (nie mówiąc, że wierzę, że to zrobili, ale nawet gdyby tak zrobili, nie zdziwiłbym się, gdyby tak się stało). – BoltClock

1

co potrzeba usunąć spację po rgbrgb(224, 226, 213)

Powiązane problemy