Projektantka stron internetowych przy pracy na swoim komputerze w nowoczesnym biurze
Źródło obrazu: monkeybusinessimages/iStock/Getty Images
Oryginalna specyfikacja Cascading Style Sheets, jak również jej znacznie nowsza wersja CSS3, to technologie używane do ulepszania i formatowania stron internetowych HTML. CSS został początkowo zaprojektowany do obsługi warstwy prezentacji strony internetowej w bardziej efektywny sposób niż formatowanie za pomocą HTML, który nigdy nie był przeznaczony do obsługi złożonej konstrukcji współczesnego Internetu. Ponieważ CSS2 jest powszechnie przyjętym rozszerzeniem CSS1, termin CSS bez liczby implikuje włączenie CSS2. Specyfikacja CSS3 jest wciąż w fazie rozwoju od lipca 2014 r., więc twórcy stron internetowych muszą wziąć pod uwagę, że obsługa funkcji różni się w zależności od przeglądarki.
CSS3 jest wstecznie kompatybilny z CSS
CSS3 to aktualizacja CSS2, która zachowuje zgodność ze wszystkimi funkcjami CSS -- CSS3 nie unieważnia żadnego kodu CSS. Kod CSS3 został zaprojektowany, aby strony internetowe wyglądały lepiej i ładowały się szybciej, a także skróciły czas tworzenia stron w przeglądarce użytkownika. CSS3 sprawia, że projektowanie stron internetowych jest mniej zależne od plików graficznych dla elementów projektu strony i skraca żądania przesyłania plików oraz czas pobierania, używając mniejszej liczby obrazów. CSS1 skupił się na formatowaniu wyglądu, podczas gdy CSS2 dodał możliwości pozycjonowania tekstu i obiektów. Starsze wersje przeglądarek, takie jak IE 9 i wcześniejsze, nie obsługują powszechnie dodanych funkcji CSS3, co może wymagać dodatkowego czasu na opracowanie kodu w celu utrzymania kodu awaryjnego CSS.
Wideo dnia
CSS3 dodaje zaokrąglone narożniki i gradienty
Przed pojawieniem się CSS3, twórcy stron internetowych musieli projektować pliki obrazów, aby dodać takie rzeczy, jak zaokrąglone rogi dla granic strukturalnych i gradienty obrazu tła; CSS3 zawiera porównywalne funkcje, które można dodać za pomocą kilku linijek kodu. W CSS programista WWW musi zaprojektować obramowanie lub gradient, przesłać go na serwer obrazu, umieścić obraz na stronie i użyć CSS do prawidłowego ustawienia obramowania. W CSS3 programista WWW może osiągnąć coś podobnego za pomocą kodu takiego jak ".roundBorder{border-radius: 10px;}". Gradienty w tle są nieco bardziej skomplikowane i wymagają innego kodu dla różnych przeglądarek. Na przykład gradient od bieli do czerni dla Chrome i IE używa kodu takiego jak „.gradBG{background: liner-gradient (biały, czarny);}”.
CSS3 dodaje funkcje animacji i efekty tekstowe
CSS3 ma kilka funkcji, których nie ma w CSS, aby poprawić wygląd elementów strony. Dzięki CSS3 programiści stron internetowych mogą dodać cień tekstu do tekstu, aby ułatwić czytanie lub dodać wizualną stylistykę, a także mogą wymusić łamanie wierszy w dłuższych słowach, aby zmieściły się w kolumnach dzięki zawijaniu słów. Przed CSS3 programiści WWW musieli kodować animację w językach skryptowych, takich jak JavaScript i jQuery; CSS3 dodaje kilka funkcji animacji do warstwy projektowej. W3C nadal pracuje nad standardem animacji internetowych, aby wypracować problemy ze zgodnością między różnymi technikami animacji.
CSS3 definiuje kolumny tekstowe
CSS3 dodaje możliwość dzielenia sekcji tekstu na wiele kolumn, aby można było czytać jak gazetę. W specyfikacji CSS2 programiści WWW mają trudności z konstruowaniem wielokolumnowych sekcji tekstu, ponieważ standard nie jest przystosowany do automatycznego dzielenia tekstu. Zwłaszcza w przypadku witryn charakteryzujących się responsywnym projektowaniem, techniką programistyczną, która zmienia układ i rozmiar treści w oparciu o wyświetlając rozdzielczość ekranu urządzenia, osoby z większymi monitorami mogą mieć trudności z odczytaniem wierszy tekstu, które rozciągają się na ekran.
