1 00:00:01,050 --> 00:00:01,500 OK. 2 00:00:01,740 --> 00:00:22,880 Więc w tej lekcji będziemy omawiać wiele różnych sposobów opisywania i reprezentujący barwy w C SS i do tej pory, jeśli pojedziemy do oceny, że pisaliśmy mamy właśnie za pomocą prostych kolorów podstawówce jak czerwony i zielony i fioletowy i oczywiście te działają OK, ale nie są one szczególnie ładne nie odcienie ładne kolory. 3 00:00:22,890 --> 00:00:30,900 Moim zdaniem a ty pewnie nigdy ich używać, ponieważ większość projektantów i większość ludzi tworzeniu stron internetowych mają bardzo specyficzny paletę kolorów. 4 00:00:31,320 --> 00:00:39,070 Czy jest to coś, co wiesz, obserwuje kolor marki jak bardzo specyficzny odcień zieleni dla marki lub jeśli jest to paleta kolorów. 5 00:00:39,250 --> 00:00:46,760 Jestem projektantem lub ktoś stworzył prawie nikt nie używa po prostu zwykły domyślny czerwony lub zielony lub fioletowy. 6 00:00:47,130 --> 00:00:52,670 Z powiedział, że istnieje sporo zbudowany w kolorach i CSSA które mają imiona. 7 00:00:52,980 --> 00:00:55,380 A w rzeczywistości jest prawdopodobnie więcej niż mogłoby się wydawać. 8 00:00:55,500 --> 00:00:59,370 I są o wiele bardziej, niż większość ludzi nigdy nie pamiętam. 9 00:00:59,370 --> 00:01:06,710 Więc nie ma rzeczy jak chabrowy lub ciemnej storczyków i nie myślę, że 147 różnych kolorów. 10 00:01:06,870 --> 00:01:10,530 I to miejsce tutaj, które mam w rzeczywistości nigdy nie używane. 11 00:01:10,540 --> 00:01:15,800 Chcę tylko pokazać wam, że jest to sposób na wizualizację wszystkich różnych nazwanych kolorów i zobaczyć oceny. 12 00:01:16,080 --> 00:01:31,500 I oczywiście problem z korzystaniem z nich nadal jest to tylko 147 kolorów, a może chcesz kolor, który podobnie jak ten złoty kolor, ale nieco jaśniejszy lub ciemniejszy lub lekko czerwonawe i nie będzie idealnym rozwiązaniem dla Ciebie. 13 00:01:31,500 --> 00:01:36,310 A potem Innym problemem jest to, że po prostu trudno zapamiętać te nazwy jak światło łupek szary. 14 00:01:36,360 --> 00:01:37,750 Nikt nie pamięta tego. 15 00:01:37,770 --> 00:01:45,940 Tak naprawdę używać tylko nazwanych kolorów, takich jak czerwony pomarańczowy fioletowy tylko dla celów debugowania bardzo szybki, aby pracę pewnie, że coś jest. 16 00:01:45,960 --> 00:01:48,410 Ja po prostu obrócić ją na czerwono i sprawdzić, czy to działa. 17 00:01:48,540 --> 00:01:54,080 A także dla celów edukacyjnych, ale większość ludzi nigdy nie korzystać z tych kolorów. 18 00:01:54,730 --> 00:01:58,940 Więc CSS oferuje kilka różnych systemów kolorów, które możemy pracować. 19 00:01:59,280 --> 00:02:03,410 I to są systemy kolorów przy okazji, że istnieje poza SS. 20 00:02:03,540 --> 00:02:11,790 Więc jeśli masz jakieś znajomości fotografii lub drukowanie i pracowałeś z kolorami, zanim można napotkać niektóre z nich. 21 00:02:12,120 --> 00:02:21,970 Tak więc pierwszy z nich jest coś, co nazywa szesnastkowy i przed mówimy o tym, dlaczego to się nazywa szesnastkowy i co to znaczy, niech po prostu spojrzeć na kilka przykładów. 22 00:02:21,990 --> 00:02:29,740 Więc tutaj pierwszą rzeczą jaką robią jest wybranie wszystkich H-1 i zmieniając ich kolor tekstu będzie czarny. 23 00:02:30,030 --> 00:02:39,550 Następną rzeczą, którą robimy to wybierając wszystkie tatuaże zmieniające kolor, który ma być odcień fioletowy, a następnie wybierając wszystkie trójek wiekowych i ucząc je za odcień różu. 24 00:02:39,600 --> 00:02:50,710 Więc co można zauważyć jest to, że zamiast słowa jak czerwony lub fioletowy Mamy teraz ten hash symbol i to technicznie nazywa oktawę Thorpe następnie sześciu cyfr. 25 00:02:51,270 --> 00:02:56,100 Tak, aby uzyskać czarny Jest to sześć zer, aby uzyskać fiolet. 26 00:02:56,160 --> 00:02:59,690 Zauważysz, że to liczby, ale istnieje również litera B w środku. 27 00:02:59,940 --> 00:03:07,000 I wreszcie, aby uzyskać ten różowawy kolor To kolejny cyfry i litery tym razem na literę F .. 28 00:03:07,020 --> 00:03:09,200 Więc co tu się dzieje. 29 00:03:09,390 --> 00:03:12,300 Mam zamiar iść do przodu i otworzyć kilka uwag, które mam. 30 00:03:12,630 --> 00:03:23,620 I mamy zamiar zrobić bardzo krótką lekcję matematyki jest to bardziej po prostu na coś moim zdaniem jest ciekawe, ale jest to również pouczające i pomoże zrozumieć, jak działa w systemie szesnastkowym. 31 00:03:23,640 --> 00:03:35,080 Więc jeśli wrócić do szkoły średniej, kiedy byłem w szkole co najmniej Dużo rozmawialiśmy o systemie dziesiętnym i jak załóżmy Chciałem stworzyć pewną liczbę trzycyfrową. 32 00:03:35,310 --> 00:03:39,660 Mamy po to 10. miejsce w miejscu setki. 33 00:03:39,690 --> 00:03:52,710 Więc gdybym chciał szereg największym trzycyfrowy numer może utworzyć jest dziewięćset dziewięćdziesiąt dziewięć najmniejszy trzy cyfrowy numer technicznie jest 111 lub 0 0 lub 1. 34 00:03:53,190 --> 00:04:07,560 Ale chodzi o to, że każde miejsce w naszym regularnym podstawy 10, która jest, co to znaczy podstawy 10 System liczb dziesiętnych Mam 10 wyborów dla każdego gniazda można zrobić od 0 do 9. 35 00:04:07,980 --> 00:04:14,950 Więc to jest podstawa 10 to, co jesteśmy przyzwyczajeni do pracy z naszymi cyframi są 0 1 2 3 4 5 6 7 8 9. 36 00:04:15,390 --> 00:04:17,630 Ale są też inne systemy numeryczne. 37 00:04:17,790 --> 00:04:21,940 Więc może słyszeliście przed i dwuskładnikowych, który jest oparty dwa. 38 00:04:21,960 --> 00:04:25,360 I tak to znaczy mamy tylko 0 i 1, jak nasze możliwości. 39 00:04:25,770 --> 00:04:32,690 Więc gdybym chciał zbudować trzycyfrową liczbę binarną największym mogę zbudować jest 1 1 1. 40 00:04:32,700 --> 00:04:35,560 To nie jest takie samo jak sto jedenaście. 41 00:04:35,580 --> 00:04:48,310 Więc nie jest to czas, aby naprawdę przejść nad tym, jak binarny działa, ale mogą pojawić się takie rzeczy jak w pokazach CSI lub jakiejkolwiek wystawie, gdzie próbują pokazać, co hacking wygląda i są całkowicie błędne. 42 00:04:48,490 --> 00:04:53,230 Ale prawdą jest, że binarny jest naprawdę bardzo ważna część jak działają komputery. 43 00:04:53,470 --> 00:04:54,850 Więc to jest oparte też. 44 00:04:54,910 --> 00:04:57,030 Więc mamy tylko dwie możliwości zero lub jeden. 45 00:04:57,370 --> 00:04:59,850 Więc szesnastkowy jest podstawa 16. 46 00:05:00,340 --> 00:05:10,480 To znaczy, że mamy 16 wyborów i te wybory przejść od zera do dziewięciu, a następnie raczej niż do 10 11 12 13 14 15. 47 00:05:10,810 --> 00:05:17,380 Są to dwa cyfra dwucyfrowych liczb, która jest problematyczna X więcej i który zawiera litery. 48 00:05:17,380 --> 00:05:22,070 Mamy więc od 0 do 9, a następnie ABC DCF. 49 00:05:22,270 --> 00:05:33,090 Więc największy szesnastkowy numer trzy cyfrowy numer byłaby F F F a najmniejszy 0 0 0. 50 00:05:33,910 --> 00:05:37,500 Więc to jest tak jak każdy inny system liczbowy wyjątkiem mamy 16 wyborów. 51 00:05:37,690 --> 00:05:50,610 I dlatego, że szesnastkowy jest używany zamiast używać tylko dziesiętny nazwanie koloru jest to, że daje nam dużo więcej możliwości przy zachowaniu nazwy recolors stosunkowo krótki. 52 00:05:50,920 --> 00:05:55,370 Więc w zasadzie ma szesnastkowy jest po prostu sobą kolory, nadając im nazwy numeryczne. 53 00:05:55,390 --> 00:05:59,200 A jeśli użyjemy bazy 10 mamy tylko 10 wyborów na cyfry. 54 00:05:59,200 --> 00:06:05,760 Więc musimy użyć więcej cyfr, jeśli używamy binarnego i że musimy użyć mnóstwo cyfr reprezentować barwy. 55 00:06:05,770 --> 00:06:07,870 Setki tysięcy cyfr. 56 00:06:07,930 --> 00:06:12,820 Dlatego liczby szesnastkowe sześć cyfr długości startu, niż Octa Thorpe. 57 00:06:13,030 --> 00:06:18,590 A potem jedna cyfra dwa trzy cztery pięć sześć. 58 00:06:18,730 --> 00:06:22,010 I sposób, że działa to nie tylko liczb losowych. 59 00:06:22,240 --> 00:06:24,590 Jest rzeczywiście trochę systemie. 60 00:06:24,640 --> 00:06:36,220 Tak więc pierwsze dwie cyfry odpowiadają ile czerwony jest kolor w następnym odpowiadać ile zielony i w ostatniej z nich odpowiada ile niebieski jest w kolorze. 61 00:06:36,760 --> 00:06:40,300 Więc mam zamiar iść do przodu i przełączyć się na naszej Apostolskiej ocenić i pokazać, co mam na myśli. 62 00:06:40,810 --> 00:06:43,510 Więc po prostu pracować z naszą H-1 tutaj. 63 00:06:43,600 --> 00:06:46,880 Mamy trzy z nich H i należy je projektować. 64 00:06:47,050 --> 00:06:51,790 Więc używać szesnastkowym wszystko co robimy jest zwężać Octa Thorpe i następnie sześć cyfr. 65 00:06:52,180 --> 00:06:58,090 Więc zacznijmy od zdefiniowania koloru czerwonego i pamiętają pierwsze dwa są czerwone. 66 00:06:58,090 --> 00:07:04,370 Tak więc nasze pierwsze dwie cyfry, jeśli chcieliśmy pełne czerwone byłoby f f bo to najwyższa liczba. 67 00:07:04,990 --> 00:07:07,630 A potem wszystko jeszcze może wynosić zero. 68 00:07:07,630 --> 00:07:10,370 Tak to jest w stanie uratować zmieni kolor na czerwony aż do góry. 69 00:07:10,660 --> 00:07:12,050 Nie ma zielone i niebieskie. 70 00:07:12,280 --> 00:07:13,270 A jeśli to zrobimy. 71 00:07:13,570 --> 00:07:19,810 Idziemy do przodu i otworzyć nasz plik zobaczysz, że są h nich są jaskrawoczerwone. 72 00:07:19,870 --> 00:07:26,400 Więc wróćmy i zagrajmy z tym trochę, a teraz wprowadzić trochę zieleni. 73 00:07:26,860 --> 00:07:36,280 Więc dajmy mu osiem, a zobaczysz mamy ten niewielki pomarańczowy i można się zastanawiać, w jaki sposób jest zielony czerwony pomarańczowy. 74 00:07:36,520 --> 00:07:46,000 A odpowiedź jest taka, że ​​to nie jest ten sam system koloru, który jesteś przyzwyczajony do mieszania farb na przykład RG B działa nieco inaczej. 75 00:07:46,150 --> 00:07:48,190 I znowu, że to coś innego filmu. 76 00:07:48,220 --> 00:08:03,160 Ale przede wszystkim, jeśli zsumować czerwony zielony i niebieski całą drogę aż tak pełne czerwone pełne zielone i pełne błękitu uzyskany kolor nie jest jak brązowe lub czarne, jak można się było spodziewać. 77 00:08:03,160 --> 00:08:07,350 To rzeczywiście białe i jest to rzeczywiście, jak lekkie prace w świecie rzeczywistym. 78 00:08:07,420 --> 00:08:13,740 Jeśli można podjąć, aby zostawić światła lub trzy lampki LCD czerwony zielony i niebieski i połączyć je, a świecą je razem. 79 00:08:13,810 --> 00:08:15,560 Można by rzeczywiście dostać białe światło. 80 00:08:15,790 --> 00:08:17,690 Tak to jest, jak działa ten kolor. 81 00:08:18,060 --> 00:08:18,310 OK. 82 00:08:18,310 --> 00:08:23,380 Więc większość czasu jesteś rzeczywiście nie wymyślanie tych kolorów od podstaw. 83 00:08:23,380 --> 00:08:24,410 Więc tak naprawdę nie jest. 84 00:08:24,520 --> 00:08:42,750 To znaczy, że to miłe, ale umiejętności nie muszą być w stanie zidentyfikować ten kolor jako pewnego rodzaju wiesz odcień fioletowy lub zielony czy cokolwiek to jest, że naprawdę nie jest zakres tego, co najczęściej będzie zrobić, to mieć próbnik kolorów , 85 00:08:43,350 --> 00:08:46,670 A więc powiedzmy, że chcę jak ciemny purpurowy odcień. 86 00:08:46,750 --> 00:08:48,160 Nie wszystkie rodzaje obrazów kolorowych. 87 00:08:48,190 --> 00:08:53,110 Jest pewne, że są na komputerze użytkownika w zależności czy masz Mac lub PC można pobrać jeden. 88 00:08:53,110 --> 00:09:01,400 Niektóre z nich są włączone, ale możemy też po prostu przejść do trybu online, a jeśli chcę jak ciemny purpurowy odcień może po prostu znaleźć to fioletowy. 89 00:09:02,290 --> 00:09:07,300 Powiedzmy, że ten kolor tutaj. 90 00:09:07,840 --> 00:09:10,160 I wtedy można po prostu skopiować. 91 00:09:10,230 --> 00:09:12,080 Myślę, że skopiowałeś. 92 00:09:12,140 --> 00:09:14,050 No po prostu skopiować. 93 00:09:14,160 --> 00:09:24,900 Jest to właśnie ten kolor i użyć jej odświeżenie i mamy ciemny fiolet. 94 00:09:24,980 --> 00:09:28,090 Więc to jest najczęściej co zrobisz musisz próbnik kolorów. 95 00:09:28,340 --> 00:09:32,390 Początkowo będziesz odebrać swoje kolory, a potem po prostu odesłać do nich. 96 00:09:32,390 --> 00:09:33,870 Więc to nie jest to najbardziej intuicyjny. 97 00:09:34,010 --> 00:09:42,920 Jest ładniejszy gdyby powiedział coś ciemnego bakłażana ale wtedy oczywiście, że nie będzie tak dokładna. 98 00:09:42,920 --> 00:09:44,540 To tylko jeden odcień ciemnego fioletu. 99 00:09:44,540 --> 00:09:47,070 I jeśli chcesz ją zmienić Jestem pecha. 100 00:09:47,120 --> 00:09:50,420 Więc to szesnastkowym. 101 00:09:50,420 --> 00:09:58,910 Kolejny system kolorów będziemy rozmawiać o to R. G. b tak RGV działa bardzo podobnie, z wyjątkiem składnia jest nieco inna. 102 00:09:58,910 --> 00:10:02,600 Więc R. G. B znajdują się trzy kanały tak jak w systemie szesnastkowym. 103 00:10:02,630 --> 00:10:04,620 Jest czerwony, zielony i niebieski. 104 00:10:05,120 --> 00:10:08,380 A co innego jest RGV jest nadal w bazie 10. 105 00:10:08,810 --> 00:10:25,360 Więc co robimy mamy trzy różne kanały czerwony, zielony, niebieski i składnia jest kolor jelita grubego, a następnie słowo są litery R. G. nawiasy B, a następnie wartość naszego odczytać wartość naszej zielony i wartość naszego niebieskiego. 106 00:10:25,640 --> 00:10:29,340 Oraz te, w zakresie od zera do 255. 107 00:10:29,900 --> 00:10:40,170 Więc w tym przypadku mówimy wszystkie te wiekowe R. G. być tam, gdzie Red wynosi zero zielony to aż do góry w kolorze niebieskim jest zerem. 108 00:10:40,670 --> 00:10:50,150 I mamy ten jasny zielony i ten jeden mamy ustawieniu wszystkich dwójek wiekowe do R. G. być tam, gdzie Red jest mniej więcej w połowie. 109 00:10:50,300 --> 00:10:52,100 Zielony jest całkowicie zniknął. 110 00:10:52,340 --> 00:11:04,140 A Blue jest mniej więcej w połowie i mamy ładny fioletowy i wtedy ten jesteśmy ustawieniu wszystkich trójek z wiekiem się głównie niebieski z odrobiną zieleni i jeszcze mniej czerwone i otrzymujemy ten odcień niebieskiego. 111 00:11:04,700 --> 00:11:07,420 Więc zróbmy kilka przykładów. 112 00:11:08,960 --> 00:11:13,720 Chodźmy dla zróbmy kolejny fioletowy. 113 00:11:13,820 --> 00:11:19,480 Więc po prostu tekst Słowo nasze nawiasów G-B, a następnie musimy nasze kanały. 114 00:11:19,640 --> 00:11:27,180 Więc pierwsza jeśli chcemy fioletowy lub chcesz niektóre czerwone zróbmy 60. 115 00:11:27,200 --> 00:11:28,800 Nie wiem, 68 czerwienią. 116 00:11:29,360 --> 00:11:39,840 Zero zielony i będzie to niebieski lub fioletowy niż niż czerwony lub fioletowy tak zrobimy stu niebiesko, a my go zapisać. 117 00:11:41,660 --> 00:11:45,560 I oczywiście, że nie wygląda dużo zmian, ale to nie zmienia się nieznacznie. 118 00:11:45,560 --> 00:11:53,920 Więc idź naprzód i teraz podkręcić przeczytać całkiem sporo 240 i widać mamy różowo fioletowy. 119 00:11:54,500 --> 00:12:13,900 A jeśli mogę przedstawić niektóre zielone i gdybym obrócić wszystko w aż tak jak wcześniej z szesnastkowy pełne czerwone, zielone i niebieskie w rzeczywistości daje nam białe i dostać czarno. 120 00:12:13,900 --> 00:12:18,080 Chcesz zero dla wszystkich trzech kanałów. 121 00:12:18,080 --> 00:12:20,690 Zatem nasze B jest bardzo podobny do miejsca po przecinku. 122 00:12:20,750 --> 00:12:22,660 Jedyną różnicą jest składnią. 123 00:12:22,940 --> 00:12:43,040 Więc zamiast wypisując coś takiego, gdzie mamy dwa kanały lub dwie cyfry czerwonego na zielony, a dwa dla niebieskiego zamiast mamy trzy gniazda i po prostu przejść od zera do 255. 124 00:12:43,040 --> 00:12:49,880 Więc po prostu inna składnia i jedna inna składnia chcę rozmawiać o to nasz GPA. 125 00:12:50,270 --> 00:12:59,100 Więc R-GA działa podobnie jak R. G. B wyjątkiem jest jeden mały skręt, który jest tam czwarty kanał o nazwie Alpha, który jest, jak można zrobić kolory przezroczyste. 126 00:12:59,270 --> 00:13:05,950 Więc R. G. V-A jest wielki, jeśli chcesz mieć jeden kolor, że robisz mniej lub bardziej przejrzyste. 127 00:13:06,230 --> 00:13:13,830 Więc sposób, że działa to dokładnie ta sama składnia wyjątkiem piszemy R. G. być i wtedy mamy cztery kanały, które musimy wypełnić. 128 00:13:14,150 --> 00:13:16,560 I pierwsze trzy tak jak przedtem. 129 00:13:16,580 --> 00:13:23,900 Wynoszą one od zera do 255, ale ostatni śpiew na kanale alfa waha się od zera do 1. 130 00:13:24,470 --> 00:13:26,370 Więc dam ci kilka przykładów tutaj. 131 00:13:26,540 --> 00:13:33,800 Tu ustawiamy wszystkie trzy być dokładnie taki sam kolor jak chodzi o kanały RG i B są zainteresowane. 132 00:13:33,920 --> 00:13:35,080 Więc 11 czerwono. 133 00:13:35,170 --> 00:13:37,850 Dziewięćdziesiąt dziewięć zielony 950 niebiesko. 134 00:13:38,480 --> 00:13:42,840 A potem czwarty kanał jesteśmy zmieniając alfa lub zmianę przezroczystości. 135 00:13:42,860 --> 00:13:47,950 Więc z czterech Alpha ze wszystkimi wszystko w górę brak przejrzystości w ogóle. 136 00:13:48,050 --> 00:13:49,810 Mamy w końcu z tej grypy. 137 00:13:50,480 --> 00:13:56,340 Kiedy powiedzieliśmy Alpha być punktem sześć dostajemy to znacznie lżejsze i bardziej przezroczysty niebieski. 138 00:13:56,690 --> 00:14:01,640 A potem możemy ustawić go za punkt dwa otrzymujemy tego, który jest ledwo tam. 139 00:14:01,880 --> 00:14:09,300 Więc zróbmy kolejny przykład zróbmy Archie B-A i tym razem zróbmy zielony. 140 00:14:09,440 --> 00:14:18,860 Więc 200 lub tak zielone i trochę niebieskiego, a potem musimy naszą alfą i niech po prostu zacząć z jednym. 141 00:14:18,860 --> 00:14:23,080 Odśwież stronę i mamy to na zielono. 142 00:14:23,180 --> 00:14:30,830 Więc teraz zróbmy to samo, ale sprawiają, że nieco bledszy Więc zróbmy punkt osiem. 143 00:14:30,960 --> 00:14:34,330 Mam zamiar odświeżyć i widać, że ma trochę jaśniejsze. 144 00:14:34,460 --> 00:14:41,810 Teraz bądźmy bardziej drastyczne dół 2,2 i widać, że dostaje dużo bardziej przejrzyste. 145 00:14:42,920 --> 00:14:47,480 Więc podsumować mamy zbudowany w kolorach, które większość ludzi nie korzystają. 146 00:14:47,690 --> 00:14:49,460 Mamy szesnastkowo. 147 00:14:49,460 --> 00:14:50,900 Mamy R. G. B wtedy.