Projektuj pięknie i wygodnie — Sass i Compass do Twoich usług!
- Instalowanie Sass i Compass oraz konfigurowanie projektów, czyli od czego zacząć naukę
- Kolory, siatki i responsywność, czyli jak zapewnić stronie dobry wygląd na każdym urządzeniu
- Automatyzacja pisania kodu CSS, czyli jak działać szybko i eliminować zbędne czynności
Kaskadowe arkusze stylów są dziś wykorzystywane przez wszystkich projektantów stron internetowych na całym świecie. Jest to bardzo wygodne i elastyczne narzędzie, jednak prawdziwie spektakularne efekty można osiągnąć dzięki zastosowaniu CSS w połączeniu z preprocesorem Sass oraz technologią Compass. Możliwe, że nie bardzo wiesz, co znaczą te nazwy, i nie masz pojęcia, do czego mogłyby Ci się przydać te dodatki. Jeśli jednak jesteś projektantem, powinieneś czym prędzej zapoznać się z tymi narzędziami, ponieważ niebywale ułatwią Ci pracę. I nie musisz być geniuszem ani informatykiem, żeby skorzystać z ich mocy. Wystarczy, że znasz HTML i CSS.
Ta książka nie została napisana z myślą o programistach. Jej celem jest pokazanie spektrum działania technologii Sass i Compass wszystkim tym, którzy często używają CSS. Znajdziesz tu informacje na temat instalowania i konfigurowania obu dodatków, sprawnego posługiwania się kolorami i tworzenia responsywnych układów stron. Po tych podstawach przyjdzie czas na naukę pisania zapytań medialnych i eksperymentalnych deklaracji CSS dla różnych przeglądarek, a także ćwiczenia ze sporządzania statystyk. Następnie dowiesz się, jak utworzyć idealnego duszka w rekordowo krótkim czasie i zautomatyzować swoją pracę za pomocą inteligentnych pętli. Przeczytaj i zastosuj, a szybko zakochasz się w dodatkach Sass i Compass!
- Sass i Compass dla początkujących
- Tworzenie projektu Sass i Compass
- Zagnieżdżanie, rozszerzanie, symbole zastępcze i domieszki
- Praca z kolorami
- Responsywne i elastyczne siatki
- Tworzenie zapytań medialnych za pomocą Sass i domieszek
- CSS3, duszki i inne cuda
- Logika programistyczna w Sass
- Sass i Compass dla zaawansowanych
Rozdziały:
Zespół wydania oryginalnego (9)
Przedmowa (11)
O autorze (13)
O korektorach merytorycznych (15)
Wprowadzenie (17)
Rozdział 1. Sass i Compass dla początkujących (21)
- Do czego służą preprocesory CSS (22)
- Skoro ostatecznym wynikiem jest kod CSS, to lepiej od razu pisać kod CSS (23)
- Dlaczego należy używać właśnie Sass i Compass (23)
- Zmienne (aby wartości definiować tylko raz) (23)
- Automatyczne kolory w formacie RGBA i konwersje (24)
- Zapomnij o przedrostkach producentów (25)
- Zagnieżdżanie reguł (26)
- Prostsze zapytania medialne (27)
- Automatyczna kompresja kodu CSS i przyspieszenie działania strony (28)
- Czym jest Sass (29)
- Czym jest Compass (29)
- Instalacja Sass i Compass (30)
- Instalacja pakietu dla systemu OS X (30)
- Instalacja Sass i Compass i praca z nimi w wierszu poleceń (31)
- Instalacja interpretera Ruby w systemie Windows (31)
- Polecenie gem (32)
- Instalacja z wiersza poleceń w systemie Mac OS X (32)
- Instalacja z wiersza poleceń w systemie Windows (33)
- Sprawdzanie wersji Compass i Sass (35)
- Sprawdzanie, które wersje Sass i Compass są dostępne (35)
- Instalowanie najnowszej wersji Sass i Compass (włącznie z wydaniami wstępnymi) (36)
- Tworzenie projektu Sass i Compass z poziomu wiersza poleceń (37)
- Automatyczne kompilowanie kodu na CSS z poziomu wiersza poleceń (38)
- Graficzne narzędzia do pracy z Sass i Compass (38)
- Scout (38)
- CodeKit (39)
- LiveReload (40)
- Praca z plikami Sass w edytorach tekstu (41)
- Podsumowanie (42)
Rozdział 2. Tworzenie projektu Sass i Compass (43)
- Tworzenie projektu Sass i Compass (44)
- Tworzenie projektów Compass (45)
- Struktura pliku config.rb (48)
- Dodawanie niezbędnych wtyczek (49)
- Ustawianie nazw i ścieżek do zasobów (50)
- Ustawianie stylu wyjściowego CSS (50)
- Tworzenie i używanie plików częściowych (54)
- Sass zapewnia kod gotowy do produkcji i łatwy w obsłudze (55)
- Importowanie pliku częściowego (56)
- Składnia definicji zmiennych w Sass (57)
- Rodzaje komentarzy w języku Sass (58)
- Standardowe komentarze CSS (58)
- Jednowierszowe komentarze Sass (58)
- Podstawowy plik index.html (59)
- Podstawa dla przyszłych projektów (60)
- Podsumowanie (60)
Rozdział 3. Zagnieżdżanie, rozszerzanie, symbole zastępcze i domieszki (63)
- Stylizowanie strony za pomocą technologii Sass i Compass (64)
- Oddzielanie układu od elementów wizualnych (65)
- Co to jest zagnieżdżanie kodu i jak umożliwia ono tworzenie modułów (68)
- Składanie zagnieżdżania (68)
- Dodawanie stylów Modernizr za pomocą selektora rodzica (73)
- Zagnieżdżanie przestrzeni nazw (79)
- Rozszerzanie istniejących reguł za pomocą dyrektywy @extend (82)
- Rozszerzanie stylów, gdy jest taka konieczność, za pomocą selektorów zastępczych (84)
- Co to są domieszki i jak za ich pomocą definiować często używane fragmenty kodu (85)
- Podstawowa składnia domieszek (87)
- Jak pisać domieszki z ustawieniami domyślnymi (88)
- Ostrzeżenie co do generowanego kodu CSS (91)
- Podsumowanie (91)
Rozdział 4. Praca z kolorami (93)
- Wystarczy jedna definicja koloru (94)
- Funkcje rozjaśniania i przyciemniania kolorów (95)
- Kolory HSL (95)
- Składnia rozjaśniania i przyciemniania kolorów (96)
- Modyfikacja znaczników (97)
- Technika clearfix w Compass (98)
- Powrót do kolorów (100)
- Domieszki w domieszkach? Ki diabeł? (102)
- Funkcje complement i invert (105)
- Funkcja inwersji (106)
- Funkcja adjust-hue (107)
- Funkcje saturacji i desaturacji (108)
- Funkcje przezroczystości i zanikania (109)
- Funkcje opacify i fade-in (110)
- Funkcja grayscale (110)
- Funkcja rgba (111)
- Funkcja mix (112)
- Funkcja adjust-color (113)
- Funkcja scale-color (114)
- Funkcje shade i tint (115)
- Połączenie wszystkiego razem (116)
- Podsumowanie (117)
Rozdział 5. Responsywne i elastyczne siatki (119)
- Argumenty przeciwko siatkom (120)
- Argumenty za używaniem systemów siatkowych (121)
- Co to jest Susy (121)
- Co tak naprawdę robi Susy (122)
- Instalowanie wtyczki do Compass Susy (123)
- Dołączanie Susy do projektu (124)
- Tworzenie siatki Susy (125)
- Definiowanie kontekstu dla siatki (125)
- Pokazywanie siatki w tle (127)
- Ustawianie modelu blokowego (128)
- Tworzenie responsywnej siatki z myślą o urządzeniach przenośnych (128)
- Tworzenie punktów brzegowych przy użyciu Susy (129)
- Tworzenie całkiem płynnej siatki (134)
- Tworzenie statycznej siatki o stałej szerokości (135)
- Używanie udogodnień dostarczanych przez Susy (136)
- Domieszki prefix, suffix i pad (136)
- Domieszka prefix (136)
- Domieszka suffix (138)
- Domieszka pad (139)
- Domieszki pre, post, squish, push i pull (140)
- Domieszka pre (140)
- Domieszka post (140)
- Domieszka squish (141)
- Domieszki push i pull (141)
- Siatki w siatkach (141)
- Domieszka nth-omega (142)
- Pozycjonowanie w odniesieniu do kontenera (144)
- Standardowa składnia i wyniki Susy (145)
- Podsumowanie (147)
Rozdział 6. Tworzenie zapytań medialnych za pomocą Sass i domieszek (149)
- Zapytania medialne w Sass (150)
- Przenoszenie stylów dotyczących zapytań medialnych do osobnego pliku częściowego (151)
- Śródliniowe zapytania medialne z Sass (151)
- Tworzenie domieszki w celu ułatwienia sobie pracy z zapytaniami medialnymi (153)
- Definiowanie punktów brzegowych jako zmiennych (153)
- Jak działa domieszka MQ (154)
- Wariacje motywu (155)
- Pisanie śródliniowych zapytań medialnych (156)
- Kompresja GZIP i CSS = zwycięstwo (161)
- Jaka jest prawdziwa różnica między rozsianymi i zgrupowanymi zapytaniami medialnymi (162)
- Robienie przeglądu kodu CSS (164)
- Podsumowanie (166)
Rozdział 7. CSS3, duszki i inne cuda (167)
- Domieszki Compass do CSS3 (168)
- Składnia domieszki własności text-shadow (168)
- Składnia własności border-radius (170)
- Kolumny (171)
- Składnia reguły kolumnowej (172)
- Domieszka box-shadow (172)
- Składnia domieszki box-shadow (173)
- Definiowanie wielu cieni (173)
- Gradienty w tle (175)
- Składnia gradientu liniowego (175)
- Składnia gradientu promienistego (177)
- Kombinacje obrazów i gradientów w tle (177)
- Dodawanie obrazów do tła za pomocą funkcji pomocniczej Compass image-url (178)
- Określanie szerokości i wysokości obrazów za pomocą funkcji pomocniczych (179)
- Pogromca bufora Compass (179)
- Duszki graficzne (180)
- Dodatkowe opcje konfiguracyjne duszków (183)
- Opcje układu (184)
- Domieszki do zamiany tekstu (184)
- Domieszka hide-text (184)
- Domieszka squish-text (185)
- Zamienianie tekstu na obraz (186)
- Tworzenie adresów URI z danymi z obrazów (187)
- Składnia wstawiania obrazów śródliniowych (188)
- Rozwiązania awaryjne na wypadek braku obsługi SVG (190)
- Przekształcenia CSS (190)
- Filtry CSS (193)
- Przejścia (195)
- Podsumowanie (195)
Rozdział 8. Logika programistyczna w Sass (197)
- Obliczenia matematyczne w Sass (198)
- Dodawanie (198)
- Odejmowanie (198)
- Mnożenie (198)
- Dzielenie (199)
- Wykonywanie obliczeń przy użyciu zmiennych (200)
- Dyrektywy sterujące (201)
- Dyrektywy sterujące @if i @else if (201)
- Pętla @for (203)
- Zmienna licznikowa (204)
- Instrukcje from to i from through (205)
- Pętla @each (206)
- Usuwanie i dodawanie jednostek (209)
- Usuwanie jednostki z wartości zmiennej (209)
- Dodawanie jednostki do wartości zmiennej (210)
- Pisanie funkcji w Sass (210)
- Operatory równości i nierówności (211)
- Operatory relacyjne (212)
- Dyrektywa @return (212)
- Sposób użycia wyniku działania funkcji (212)
- Dyrektywa @debug (213)
- Dyrektywa @warn (215)
- Podsumowanie (215)
Rozdział 9. Sass i Compass dla zaawansowanych (217)
- Wyłączenie obsługi wybranych przeglądarek w Compass (218)
- Zmienne konfiguracyjne (219)
- Opera przeszła na silnik WebKit (220)
- Dodawanie eksperymentalnej obsługi dla najnowszych własności CSS (221)
- Definiowanie wartości eksperymentalnych (223)
- Interaktywna powłoka Sass (223)
- Interaktywny Compass (224)
- Dodawanie wtyczki Sass do importowania plików partiami (224)
- Tworzenie wielu osobnych plików CSS (226)
- Konwertowanie plików częściowych na samodzielne arkusze stylów (226)
- Statystyki Compass (226)
- Kasowanie zawartości bufora Sass (228)
- Wybieranie metody kompilacji kodu Sass na jeden raz (229)
- Sprawozdanie z misji (229)
- Naprawianie błędów ludzkich (229)
- Wychwytywanie typowych problemów za pomocą narzędzia lint (231)
- Fakty, nie przypuszczenia (232)
- Wszyscy kochają Narzędzia dla programistów przeglądarki Chrome (232)
- Wyszukiwanie nieużywanych stylów (235)
- Uwagi końcowe (236)
- Podsumowanie (236)
Skorowidz (237)
Najniższa cena z 30 dni przed obniżką 36,75zł
|
