„property: 0” czy „property: 0px” w CSS?

Question 1

Widziałem często używany ten zapis i zastanawiałem się, czy jest jakaś zauważalna różnica między tymi dwoma zapisami?

element#id
{
  property: 0;
}

i

element#id
{
  property: 0px;
}

Używam go property: 0px;cały czas, ponieważ wydaje mi się, że wygląda lepiej, ale nie jestem pewien, czy przeglądarka interpretuje 0pxinaczej niż 0.

Czy ktoś wie, który z nich jest lepszy lub poprawny?

Question 2

Identyfikatory jednostkowe są opcjonalne , ale nie ma znakomity wzrost wydajności (chociaż są oszczędności dwa znaki).

CSS2 - ze specyfikacji W3C CSS 2.1 dla składni i podstawowych typów danych :

Format wartości długości (oznaczonej w tej specyfikacji przez <długość>) to <liczba> (z kropką dziesiętną lub bez), po której bezpośrednio następuje identyfikator jednostki (np. Px, em itp.). Po zerowej długości identyfikator jednostki jest opcjonalny.

(Podkreślenie moje)

CSS3 - z modułu wartości i jednostek CSS W3C, poziom 3 (obecnie w rekomendacji kandydata w momencie pisania tego tekstu)

W przypadku długości zerowych identyfikator jednostki jest opcjonalny (tj. Może być składniowo reprezentowany jako 0).

Question 3

Chociaż jednostka jest opcjonalna, gdy wartość jest 0, zwykle ją zostawiam, ponieważ mogę następnie dostosować wartości za pomocą narzędzi programistycznych Chrome, klikając wartość i naciskając klawisze strzałek w górę / w dół. Bez jednostki to nie jest możliwe.

Ponadto minifier CSS i tak odbierają jednostki 0wartości, więc ostatecznie nie będzie to miało znaczenia.

Question 4

Oni są tacy sami. Przeglądarka interpretuje oba jako 0, więc wybierz to, co jest dla Ciebie bardziej czytelne.

Question 5

Zero czegokolwiek to zero. 0px= 0%= 0em= 0pt=0

Większość ludzi zostawia urządzenie wyłączone, ponieważ jest to po prostu niepotrzebny bałagan.

Question 6

O ile mi wiadomo, nie ma między nimi różnicy, ponieważ 0px = 0em = 0ex = 0% = 0. Tylko od Ciebie, jako programisty, zależy, co lubisz najbardziej (chyba, że masz korporacyjne standardy kodowania, których musisz przestrzegać).

Z większości przykładów kodu, które widziałem, większość ludzi używa wersji bez jednostek. Dla mnie wygląda po prostu czyściej. Jeśli przesyłasz znaczną ilość danych (powiedzmy, jeśli jesteś Google), te dwa bajty mogą w sumie dać dużą przepustowość, zwłaszcza, że prawdopodobnie powtórzysz je wiele razy w arkuszu stylów.

Question 7

Zero pikseli to zero cali, zero metrów i tak dalej. 0to wszystko czego potrzebujesz.

Question 8

Osobiście uważam, że jest 0czystszy niż 0px. To dwa dodatkowe znaki, które mogą się sumować. Po co dodawać dodatkowe bajty, kiedy nie jest to konieczne. Widziałem, padding: 0px 0px 0px 0pxco można łatwo wyrazić padding: 0zbyt często.

Question 9

Możesz użyć jednego z nich - moja najlepsza rada to nie martwić się zbytnio, ale konsekwentnie robić to w jedną lub drugą stronę. Osobiście wolę określić „0px” z następujących powodów:

Użycie 0px sprawia, że rzeczy są bardziej spójne ze wszystkimi innymi określonymi rozmiarami „pikseli”
Jest również bardziej rozwlekły i bardzo wyraźnie pokazuje, że ustawiasz zerową długość zamiast flagi „wyłącz to”
Nieco łatwiej jest zmienić wartość „0px”, aby w razie potrzeby zmienić ją na inną wartość

Question 10

Jak mówią inni, tak naprawdę nie ma znaczenia, czy jest to 0, chociaż decyduję się dodać pomiary do wszystkich moich wartości, aby każdy, kto przegląda moje pliki CSS, mógł ocenić, z jakimi pomiarami będzie miał do czynienia gdzie indziej.

Answer 1

86

Widziałem często używany ten zapis i zastanawiałem się, czy jest jakaś zauważalna różnica między tymi dwoma zapisami?

element#id
{
  property: 0;
}

i

element#id
{
  property: 0px;
}

Używam go property: 0px;cały czas, ponieważ wydaje mi się, że wygląda lepiej, ale nie jestem pewien, czy przeglądarka interpretuje 0pxinaczej niż 0.

Czy ktoś wie, który z nich jest lepszy lub poprawny?

css properties zero Mikser
źródło

1

Dobre pytanie, ale wcześniej niż ten prawdopodobny duplikat: stackoverflow.com/q/5359222/292060 , ale ta ma lepszą odpowiedź, cytując specyfikację.

goodeye

1

Niezależnie od tego, z którego korzystasz, zachowaj spójność przez cały projekt.

PBwebD,

Answer 2

1

Dobre pytanie, ale wcześniej niż ten prawdopodobny duplikat: stackoverflow.com/q/5359222/292060 , ale ta ma lepszą odpowiedź, cytując specyfikację.

goodeye

Answer 3

1

Niezależnie od tego, z którego korzystasz, zachowaj spójność przez cały projekt.

PBwebD,

Answer 4

Identyfikatory jednostkowe są opcjonalne , ale nie ma znakomity wzrost wydajności (chociaż są oszczędności dwa znaki).

CSS2 - ze specyfikacji W3C CSS 2.1 dla składni i podstawowych typów danych :

Format wartości długości (oznaczonej w tej specyfikacji przez <długość>) to <liczba> (z kropką dziesiętną lub bez), po której bezpośrednio następuje identyfikator jednostki (np. Px, em itp.). Po zerowej długości identyfikator jednostki jest opcjonalny.

(Podkreślenie moje)

CSS3 - z modułu wartości i jednostek CSS W3C, poziom 3 (obecnie w rekomendacji kandydata w momencie pisania tego tekstu)

W przypadku długości zerowych identyfikator jednostki jest opcjonalny (tj. Może być składniowo reprezentowany jako 0).

Answer 5

1

Wątpię, czy naprawdę oszczędzasz 2 bajty, gdy kompresja GZIP jest aktywna. Dla mnie to kwestia tego, z czym czujesz się komfortowo. Jednak niektóre Linters CSS mogą nie lubić 0px.

Manuel Arwed Schmidt

Answer 6

34

Chociaż jednostka jest opcjonalna, gdy wartość jest 0, zwykle ją zostawiam, ponieważ mogę następnie dostosować wartości za pomocą narzędzi programistycznych Chrome, klikając wartość i naciskając klawisze strzałek w górę / w dół. Bez jednostki to nie jest możliwe.

Ponadto minifier CSS i tak odbierają jednostki 0wartości, więc ostatecznie nie będzie to miało znaczenia.

Mikser
źródło

+1 za obserwację, że minifier wiedzą o tym i że istnieje funkcjonalność, którą można uzyskać, włączając je.

Graham P Heath

9

Narzędzia programistyczne Chrome domyślnie ustawiają piksel, jeśli naciśniesz klawisze strzałek w górę / w dół na 0 bez identyfikatora. Ponadto w Narzędziach dla programistów Chrome, jeśli strzałka w dół do 0, zachowuje piksel.

PBwebD,

1

@ testing123: Nie sądzę, żeby tak było w momencie, gdy pisałem tę odpowiedź, ale dobrze to wiedzieć.

Blender,

czy wystąpią problemy z czasem wykonania z 0 i 0 pikseli, jeśli są one używane w wielu miejscach w aplikacji?

Kurkula

Answer 7

+1 za obserwację, że minifier wiedzą o tym i że istnieje funkcjonalność, którą można uzyskać, włączając je.

Graham P Heath

Answer 8

9

Narzędzia programistyczne Chrome domyślnie ustawiają piksel, jeśli naciśniesz klawisze strzałek w górę / w dół na 0 bez identyfikatora. Ponadto w Narzędziach dla programistów Chrome, jeśli strzałka w dół do 0, zachowuje piksel.

PBwebD,

Answer 9

1

@ testing123: Nie sądzę, żeby tak było w momencie, gdy pisałem tę odpowiedź, ale dobrze to wiedzieć.

Blender,

Answer 10

czy wystąpią problemy z czasem wykonania z 0 i 0 pikseli, jeśli są one używane w wielu miejscach w aplikacji?

Kurkula

Answer 11

15

Oni są tacy sami. Przeglądarka interpretuje oba jako 0, więc wybierz to, co jest dla Ciebie bardziej czytelne.

Sebastian Patane Masuelli
źródło

Czy istnieje „właściwy” lub zgodny z normami wybór? Wiem, że nie możesz pisać border: 3 solid, ponieważ nie ma jednostek, ale czy są jakieś standardy sieciowe na zero?

Blender

1

Jak wspomniałem w mojej odpowiedzi, dzieje się tak, ponieważ wszystkie są identyczne: zero razy cokolwiek jest nadal równe zero, niezależnie od tego, czy mnożysz przez rozmiar piksela, em, ex, czy procent.

AgentConundrum

Nie jestem pewien, co rozumiesz przez standardy sieciowe, ale „margin: 10px 0 0 10px” działa dobrze, podobnie jak „border: 0”, co oznacza, że możesz użyć zera jako odpowiednika „none”.

Tom

1

@blender Sprawdź moją odpowiedź poniżej na standardy sieciowe z linkiem do dokumentacji.

Chris Bier

3

-1 w przypadku odpowiedzi z treścią dyskusyjną bez odniesienia, linków ani uzasadnienia. popieraj swoją opinię danymi lub jasno określ, że to tylko Twoja opinia, a nie informacje faktyczne.

Answer 12

Czy istnieje „właściwy” lub zgodny z normami wybór? Wiem, że nie możesz pisać border: 3 solid, ponieważ nie ma jednostek, ale czy są jakieś standardy sieciowe na zero?

Blender

Answer 13

1

Jak wspomniałem w mojej odpowiedzi, dzieje się tak, ponieważ wszystkie są identyczne: zero razy cokolwiek jest nadal równe zero, niezależnie od tego, czy mnożysz przez rozmiar piksela, em, ex, czy procent.

AgentConundrum

Answer 14

Nie jestem pewien, co rozumiesz przez standardy sieciowe, ale „margin: 10px 0 0 10px” działa dobrze, podobnie jak „border: 0”, co oznacza, że możesz użyć zera jako odpowiednika „none”.

Tom

Answer 15

1

@blender Sprawdź moją odpowiedź poniżej na standardy sieciowe z linkiem do dokumentacji.

Chris Bier

Answer 16

3

-1 w przypadku odpowiedzi z treścią dyskusyjną bez odniesienia, linków ani uzasadnienia. popieraj swoją opinię danymi lub jasno określ, że to tylko Twoja opinia, a nie informacje faktyczne.

Answer 17

11

Zero czegokolwiek to zero. 0px= 0%= 0em= 0pt=0

Większość ludzi zostawia urządzenie wyłączone, ponieważ jest to po prostu niepotrzebny bałagan.

Gdakanie
źródło

1

Wyjątkiem są jednostki czasu: 0nie jest prawidłową alternatywą dla 0s/0ms

Henrik Christensen

Answer 18

1

Wyjątkiem są jednostki czasu: 0nie jest prawidłową alternatywą dla 0s/0ms

Henrik Christensen

Answer 19

O ile mi wiadomo, nie ma między nimi różnicy, ponieważ 0px = 0em = 0ex = 0% = 0. Tylko od Ciebie, jako programisty, zależy, co lubisz najbardziej (chyba, że masz korporacyjne standardy kodowania, których musisz przestrzegać).

Z większości przykładów kodu, które widziałem, większość ludzi używa wersji bez jednostek. Dla mnie wygląda po prostu czyściej. Jeśli przesyłasz znaczną ilość danych (powiedzmy, jeśli jesteś Google), te dwa bajty mogą w sumie dać dużą przepustowość, zwłaszcza, że prawdopodobnie powtórzysz je wiele razy w arkuszu stylów.

Answer 20

6

Jeśli przesyłasz znaczną ilość danych (na przykład jeśli jesteś Google), lepiej użyj narzędzi do minifikacji, które robią to za Ciebie: p

John Kurlak

Answer 21

4

Zero pikseli to zero cali, zero metrów i tak dalej. 0to wszystko czego potrzebujesz.

meder omuraliev
źródło

Przez chwilę zamierzałem obniżyć głosowanie nad twoim postem, ponieważ myślałem o twoim stwierdzeniu, że 0 pikseli równa się 0 cali, i tak dalej było fałszywe. :) Ponieważ myślałem, jak to możliwe? są to różne jednostki.

Web_Designer,

Answer 22

Przez chwilę zamierzałem obniżyć głosowanie nad twoim postem, ponieważ myślałem o twoim stwierdzeniu, że 0 pikseli równa się 0 cali, i tak dalej było fałszywe. :) Ponieważ myślałem, jak to możliwe? są to różne jednostki.

Web_Designer,

Answer 23

Osobiście uważam, że jest 0czystszy niż 0px. To dwa dodatkowe znaki, które mogą się sumować. Po co dodawać dodatkowe bajty, kiedy nie jest to konieczne. Widziałem, padding: 0px 0px 0px 0pxco można łatwo wyrazić padding: 0zbyt często.

Answer 24

Możesz użyć jednego z nich - moja najlepsza rada to nie martwić się zbytnio, ale konsekwentnie robić to w jedną lub drugą stronę. Osobiście wolę określić „0px” z następujących powodów:

Użycie 0px sprawia, że rzeczy są bardziej spójne ze wszystkimi innymi określonymi rozmiarami „pikseli”
Jest również bardziej rozwlekły i bardzo wyraźnie pokazuje, że ustawiasz zerową długość zamiast flagi „wyłącz to”
Nieco łatwiej jest zmienić wartość „0px”, aby w razie potrzeby zmienić ją na inną wartość

Answer 25

Jak mówią inni, tak naprawdę nie ma znaczenia, czy jest to 0, chociaż decyduję się dodać pomiary do wszystkich moich wartości, aby każdy, kto przegląda moje pliki CSS, mógł ocenić, z jakimi pomiarami będzie miał do czynienia gdzie indziej.

„property: 0” czy „property: 0px” w CSS?

Odpowiedzi: