Nazwa koloru, który powinien być wyświetlany na interfejsie wyjściowym, jest zapisana we właściwości tła. Na przykład, ' tło: czerwone ” ustawi kolor tła na czerwony. Podobnie, aby zachować proste tło lub usunąć kolory tła, „ nic ' I ' przezroczysty ” są używane we właściwości tła zamiast nazwy koloru.
Zarówno tło: brak, jak i tło: przezroczyste wyświetlają te same wyniki, ponieważ całkowicie usuwają tło. Tak więc nie ma zasadniczej różnicy między działaniem tych dwóch.
Różnica między „tłem: brak” a „tłem: przezroczystym” w CSS
„ tło: brak ' I ' tło: przezroczyste ”, oba są używane w tym samym celu. Ustawiają kolor tła jako brak lub usuwają kolor z tła.
Ale nadal, jeśli myślimy krytycznie i próbujemy znaleźć różnice między nimi, to istnieją dwie możliwe różnice:
- Główna różnica między nimi polega na tym, że są to różne słowa z różną liczbą znaków. Tak więc wiele osób uważa, że kiedy są używane w dużym dokumencie wiele razy w różnych miejscach, dokument, który używa „ tło: brak ” może zająć mniej czasu, ponieważ żaden nie ma mniejszej liczby znaków niż przezroczysty.
- Jeśli mówimy o tym, jak są kompilowane, to „ tło: brak ” ustawia obraz tła na brak lub, powiedzmy, usuwa kolor tła. Z drugiej strony „ tło: przezroczyste ” ustawia przezroczysty kolor jako tło tekstu lub całego interfejsu (w zależności od tego, co jest określone w elemencie stylu CSS).
Ale tego typu różnice można pominąć, jeśli mówimy o wpływie, jaki mają one na interfejs graficzny, ponieważ na końcu nie będzie żadnej różnicy.
Przykład: Zastosowanie tła: brak i tła: przezroczyste
Udowodnijmy praktycznie, że „ tło: brak ' I ' tło: przezroczyste ” zrób to samo z interfejsem. Napisz fragment kodu, aby poznać wpływ właściwości tła CSS zarówno na brak, jak i na przezroczystość:
< h2 ID = 'tekst' >To jest prosty tekst wyjaśniający cel zastosowania background:none i background:transparent
< / h2 >
We wspomnianym fragmencie kodu w dokumencie HTML utworzony został nagłówek, któremu nadano identyfikator o nazwie „ tekst ”.
Dodanie właściwości tła CSS
Tekst otrzymał identyfikator, więc utwórzmy selektor id w elemencie stylu CSS i po prostu dodajmy „ tło: brak ”własność w nim:
# tekst {tło : nic ;
}
Podobnie, aby napisać „ tło: przezroczyste ”, nie ma różnicy w metodzie. Po prostu zastąp „ nic ' z ' przezroczysty ”:
# tekst {tło : przezroczysty ;
}
Oboje ' tło: brak ' I ' tło: przezroczyste ” wygeneruje ten sam wynik:
Oznacza to, że nie ma między nimi żadnej różnicy i są one kompilowane w ten sam sposób.
Dodawanie właściwości tła z nazwą koloru
Teraz, jeśli dodamy nazwę koloru zamiast pisać „ nic ' I ' przezroczysty ”, dane wyjściowe nigdy nie będą takie same, jak generowane przez „ tło: brak ' I ' tło: przezroczyste ”. Na przykład wpisujemy nazwę koloru we właściwości tła:
# tekst {tło : jasny niebieski ;
}
Różnica jest wyraźna. Nie wyświetla takiego samego wyjścia jak w przypadku tło: brak I tło: przezroczyste :
To podsumowuje różnicę między background:none i background:transparent.
Wniosek
Polecenia background:none i background:transparent służą odpowiednio do usuwania koloru tła i ustawiania koloru tła jako przezroczystego. Ale ponieważ oba mają dokładnie taki sam wpływ na interfejs wyjściowy, zarówno background:none, jak i background:transparent mogą być używane do tego samego celu.