Różnica między CSS3 i CSS

Nowoczesna strona internetowa składa się z trzech różnych plików lub kodów, HTML, JavaScript i CSS. HTM definiuje strukturę strony internetowej; JavaScript określa, jak będzie się zachowywać strona internetowa; a CSS określa ogólny wygląd i styl strony internetowej. Specyfikacje CSS są utrzymywane przez W3C. Z jednej strony mamy podstawową wersję, a z drugiej najnowszą i potężną CSS3. Rzućmy okiem na różnice między nimi.

Co to jest CSS?

CSS jest krótki dla kaskadowych arkuszy stylów. Zapewnia kreatywną kontrolę nad ogólnym projektem i układem twoich stron internetowych. Celem CSS jest usprawnienie procesu stylizacji stron internetowych. CSS to prosty język projektowy, który pozwala tworzyć przyciągające wzrok strony internetowe. Pomaga ustalić myśli, takie jak kolor, czcionka, pozycjonowanie niektórych elementów i odrobina animacji. Jeśli użyłeś stylów w tych edytorach tekstu, takich jak programy Microsoft Word lub Layout, takie jak Adobe Indesign, CSS poczuje się ci znajomy. Każdy element wizualny na stronie internetowej, taki jak tło, pola, tekst, nagłówek i stopka, dosłownie wszystko można zmienić za pomocą CSS.

Co to jest CSS3?

CSS3 to najnowsza iteracja języka arkuszy stylów kaskadowych, a numer 3 nie jest tylko odniesieniem do nowych funkcji w CSS, ale na trzecim poziomie w postępie specyfikacji CSS. CSS3 to nowa modułowa wersja specyfikacji CSS z kilkoma ekscytującymi nowymi funkcjami, dzięki czemu Twój projekt internetowy stara się zupełnie nowy poziom, dzięki czemu jest to łatwiejsze i bardziej elastyczne. Jest to nowy koc używany do opisania nowych funkcji i funkcjonalności CSS, które pojawiły się w ciągu ostatnich kilku lat. Teraz częścią tej nowej funkcjonalności jest ciągły rozwój CSS poprzez W3C, a inna jego część jest kierowana przez nową generację przeglądarek, które są specjalnie zaspokajane, aby zapewnić projektantom mocniejsze narzędzia do tworzenia stron internetowych. Wnosi mnóstwo nowych funkcji i dodatków, takich jak zaawansowane selektory, zaokrąglone zakręty, nowe układy, animacje lub przejścia, cienie, gradienty, wybór kolorów i wiele innych.

Różnica między CSS3 i CSS

Selektory

- Selektory znajdują się w samym sercu kaskadowych arkuszy stylów, które są zasadniczo wzorami używanymi do wyboru elementów HTML, które chcesz stylizować. CSS3 zawiera całą nowe, solidne przyborniki zaawansowanych selektorów, które pozwalają wybrać bardziej określone elementy stylizacji, jednocześnie eliminując potrzebę tych dowolnych identyfikatorów i klas, które tak często dołączasz. Przy tak szerokiej gamie selektorów możesz celować w prawie każdy element strony. CSS3 rozszerza podstawową funkcjonalność selektora atrybutów, umożliwiając wybór elementów na podstawie łańcuchów w zakresie wartości atrybutów.

Zabarwienie

- CSS3 oferuje nowe ekscytujące sposoby zabawy kolorami. Wcześniej kolory zostały zadeklarowane przy użyciu formatu szesnastkowego - systemu numerowania, który zaczyna się od 00 i kończy na FF. Specyfikacja kolorów CSS3 określa rozszerzoną listę kolorowych słów kluczowych obsługiwanych przez przeglądarki internetowe. Lista zawiera teraz dodatkowe 147 kolorowych słów kluczowych i nowy model o nazwie „RGBA” (dodanie alfa), który umożliwia specyfikację krycia koloru. Najważniejszą zmianą jest to, że możesz teraz zadeklarować półprzestrzenne kolory.

Radiusz graniczny

- Właściwość CSS Border-Radius definiuje zaokrąglone zakątki dowolnego elementu, umożliwiając łatwe wykorzystanie zaokrąglonych zakątków w elementach projektu. Dzięki CSS3 możesz nawet używać obrazów do granic i tworzyć zaokrąglone zakręty na swoich granicach bez obrazów lub dodatkowych znaczników. Ma również dodatki właściwości tła, takie jak możliwość posiadania wielu tła i ulepszeń do kontrolowania rozmiaru obrazu, orientacji i przycinania tła. Właściwość pudełka Shadow pozwala dodawać cienie do elementów.

Formatowanie tekstu

- CSS3 zapewnia mnóstwo właściwości formatowania tekstu, z których wiele jest już obecnych w CSS2, ale z dodatkowymi funkcjami, takimi jak nowa właściwość Shadow Propert. Ta nowa właściwość Tekst Shadow umożliwia dodawanie cieni do poszczególnych znaków w węzłach tekstowych. Efekt cienia dla tekstu sprawia, że ​​strona internetowa wygląda bardziej żywą i atrakcyjną. Przed CSS3 zrobiłbyś to samo za pomocą obrazu lub zduplikowanego elementu tekstowego, a następnie ustaw go.

Gradienty

- Gradients są jedną z najbardziej oczekiwanych funkcji, które będą rodzime dla CSS. Są to niezwykle mocne dodatki do CSS, które pozwalają ustawić kolor tła elementu na gradient. Możesz użyć zwykłego, prostego gradientu dwukolorowego lub możesz wyjść na całość, używając licznych przystanków i różnych poziomów krycia w gradiencie. Gradienty mogą być liniowe lub promieniowe i tworzyć efekty wizualne, które są tak bogate wizualnie, jak gradienty w innych technologiach, takich jak SVG.

Przejścia i animacje

- CSS3 ma kolejną interesującą funkcję o nazwie Transitions, która zapewnia sposób kontrolowania prędkości animacji po przejściu z jednej wartości właściwości CSS do drugiej. Na przykład możesz animować wysokość elementu od zerowych pikseli do stu pikseli, aby ujawnić zawartość elementu. Animacje CSS3 mają własną specyfikację i pozwalają tworzyć klatki kluczowe do kontrolowania animacji i właściwości, które pozwalają kontrolować czas, czas trwania i zapętlanie animacji.

CSS3 vs. CSS: wykres porównawczy

Podsumowanie CSS3 vs. CSS

CSS3 jest pod każdym względem godnym następcą, który zawiera interesujące nowe funkcje, które pomogą w twoich staraniach dotyczących projektowania stron internetowych. Ma wiele potężnych funkcji, które sprawiają, że projektowanie stron internetowych działa prostsza, łatwiejsza i elastyczna niż kiedykolwiek. CSS3 zapewnia nie tylko użytkownikom mnóstwo ekscytujących nowych funkcji do zabawy, ale także, aby zapewnić użytkownikom bardziej elastyczne sposoby rozwiązywania istniejących problemów. W CSS3 jest teraz ponad 40 modułów. Po pierwsze, CSS3 zawiera zupełnie nowy zestaw zaawansowanych selektorów, który pozwala wybrać bardziej określone elementy stylistyki.