1 00:00:00,000 --> 00:00:00,500 2 00:00:00,500 --> 00:00:04,500 >> [Грає музика] 3 00:00:04,500 --> 00:00:10,099 4 00:00:10,099 --> 00:00:12,224 Аллісон Бухгольц-AU: Так Ми в основному тільки збирається 5 00:00:12,224 --> 00:00:14,629 щоб дати вам короткий виклад з CSS, тому що ми знаємо, 6 00:00:14,629 --> 00:00:16,420 що він не був покритий у всіх розділах. 7 00:00:16,420 --> 00:00:20,090 І ми дійсно хочемо, щоб переконатися, що ви хлопці, є цей інструмент у вашому розпорядженні, 8 00:00:20,090 --> 00:00:24,790 тому що він має можливість робити Ваші сайти виглядають набагато красивіше. 9 00:00:24,790 --> 00:00:28,660 >> І якщо ви будуєте сайт, то Ви, мабуть, хочете, щоб зробити його красиво. 10 00:00:28,660 --> 00:00:31,372 Я маю на увазі, ви не повинні, але я хотів би запропонувати його. [Сміється] 11 00:00:31,372 --> 00:00:35,430 Якщо ви хочете, щоб користувачі, щоб використовувати його, ви, можливо, хочете, щоб зробити його трохи [нерозбірливо]. 12 00:00:35,430 --> 00:00:39,130 Отже, ми збираємося, щоб спробувати дати вам тільки деякі основні інструменти і розуміння, 13 00:00:39,130 --> 00:00:42,340 так що, коли ви виходите, і ви дослідження речі про CSS, 14 00:00:42,340 --> 00:00:45,902 це не повна маячня, як CSS іноді бути. 15 00:00:45,902 --> 00:00:47,240 >> ТОМАС Реймерс: Так. 16 00:00:47,240 --> 00:00:49,930 Еллісон сказав, що це дуже добре. 17 00:00:49,930 --> 00:00:53,250 Так що я думаю, перше, що ми повинні почати з того, що CSS? 18 00:00:53,250 --> 00:00:55,750 Так CSS є дивним. 19 00:00:55,750 --> 00:00:56,250 CSS-- 20 00:00:56,250 --> 00:00:58,320 >> Аллісон Бухгольц-AU: Це Ім'я нашого семінару. 21 00:00:58,320 --> 00:00:58,434 >> ТОМАС Реймерс: Так. 22 00:00:58,434 --> 00:01:00,130 Це дуже важливо, що Ви розумієте, що до того часу. 23 00:01:00,130 --> 00:01:03,090 Якщо ви тільки відняти один річ, це те, що CSS, якщо дивним. 24 00:01:03,090 --> 00:01:06,180 Два це CSS означає Каскадні таблиці стилів. 25 00:01:06,180 --> 00:01:10,380 Таким чином, в своїй основі, CSS є лист стилі, то 26 00:01:10,380 --> 00:01:13,200 вона дозволяє укладати веб-сторінки. 27 00:01:13,200 --> 00:01:16,609 І потім, що це означає, що, це спосіб додати стиль Вашої веб-сайтів. 28 00:01:16,609 --> 00:01:18,900 Так за стилем, ми маємо на увазі всі це не structural-- 29 00:01:18,900 --> 00:01:24,350 так такі речі, як кольори, тло, зображення, межі, начебто, оббивка, 30 00:01:24,350 --> 00:01:25,040 Поля. 31 00:01:25,040 --> 00:01:27,310 Ми будемо говорити про те, що Все це означає, в небагато. 32 00:01:27,310 --> 00:01:30,110 >> Таким чином, ми просто пішли вперед і відкрив обидва ці в Gedit. 33 00:01:30,110 --> 00:01:32,680 Так що це index.html. 34 00:01:32,680 --> 00:01:34,800 І це main.css. 35 00:01:34,800 --> 00:01:36,829 Так main.css не має нічого. 36 00:01:36,829 --> 00:01:38,412 Аллісон Бухгольц-AU: Ні стиль досі. 37 00:01:38,412 --> 00:01:39,245 ТОМАС Реймерс: Ні. 38 00:01:39,245 --> 00:01:42,577 І, як ви побачите, що це дійсно потворні сайт. 39 00:01:42,577 --> 00:01:44,160 Аллісон Бухгольц-AU: Це просто. 40 00:01:44,160 --> 00:01:45,820 ТОМАС Реймерс: Так. 41 00:01:45,820 --> 00:01:49,150 Так, це не бридко, це просто мінімалізмом. 42 00:01:49,150 --> 00:01:53,430 А потім ось у нас є index.html. 43 00:01:53,430 --> 00:01:55,729 І так швидко повторення HTML, Еллісон, 44 00:01:55,729 --> 00:01:57,270 Ви хочете, щоб просто поговорити про сторінку? 45 00:01:57,270 --> 00:01:58,395 >> Аллісон Бухгольц-AU: Так. 46 00:01:58,395 --> 00:02:01,100 Так, очевидно, ми маємо HTML тег, який тільки імена HTML файл. 47 00:02:01,100 --> 00:02:07,080 У нас є заголовок тут, за допомогою CSS Awesomeness, which-- якщо ви повернетеся. 48 00:02:07,080 --> 00:02:07,720 Де це? 49 00:02:07,720 --> 00:02:09,136 >> ТОМАС Реймерс: Ой. 50 00:02:09,136 --> 00:02:10,301 Так, ви можете бачити. 51 00:02:10,301 --> 00:02:12,092 Аллісон Бухгольц-AU: І зверніть увагу на заголовок 52 00:02:12,092 --> 00:02:14,120 це вкладка заголовок прямо тут. 53 00:02:14,120 --> 00:02:17,130 А потім "Hello, World!" є Текст, який ми тільки що 54 00:02:17,130 --> 00:02:19,620 відображення на веб- сторінка, яка is-- повернутися. 55 00:02:19,620 --> 00:02:21,290 Тому. 56 00:02:21,290 --> 00:02:24,287 Що саме в нашому організмі here-- звичайний текст. 57 00:02:24,287 --> 00:02:26,120 Крім того, одна справа зверніть увагу, якщо ви подивитеся тут, 58 00:02:26,120 --> 00:02:29,410 Томас перемикається вгору це два з нашого слайда. 59 00:02:29,410 --> 00:02:32,035 Так що, поки у вас є всі три з них, ти в порядку. 60 00:02:32,035 --> 00:02:34,044 Вони можуть бути в будь-якому порядку, вони хочуть. 61 00:02:34,044 --> 00:02:39,368 Що найважливіше це всього лише у вас є кожна з цих трьох речей. 62 00:02:39,368 --> 00:02:40,340 >> ТОМАС Реймерс: Круто. 63 00:02:40,340 --> 00:02:41,111 Додати тип документа? 64 00:02:41,111 --> 00:02:42,235 Аллісон Бухгольц-AU: Так. 65 00:02:42,235 --> 00:02:43,068 ТОМАС Реймерс: Так. 66 00:02:43,068 --> 00:02:43,769 Круто. 67 00:02:43,769 --> 00:02:46,102 Аллісон Бухгольц-AU: Мабуть, мої мікрофони не люблять мене. 68 00:02:46,102 --> 00:02:49,650 ТОМАС Реймерс: О, дай нам хвилинку просто в той час як Еллісон переключається з її мікрофон. 69 00:02:49,650 --> 00:02:50,500 Так що так. 70 00:02:50,500 --> 00:02:52,030 Отже, ми маємо нашу головну сторінку. 71 00:02:52,030 --> 00:02:53,890 Це свого роду без стилів. 72 00:02:53,890 --> 00:02:54,780 Ми не так багато. 73 00:02:54,780 --> 00:02:57,110 Ми просто повинні в основному текст. 74 00:02:57,110 --> 00:02:59,470 У нас є таблиця стилів. 75 00:02:59,470 --> 00:03:00,220 У нас є титул. 76 00:03:00,220 --> 00:03:04,020 Так що просто голими кістками Компоненти зробити сайт. 77 00:03:04,020 --> 00:03:08,880 >> Так звідти, давайте говорити про те, що CSS є 78 00:03:08,880 --> 00:03:11,270 і як він виглядає, і все, що. 79 00:03:11,270 --> 00:03:12,047 Таким чином, для that-- 80 00:03:12,047 --> 00:03:13,755 Аллісон Бухгольц-AU: Повернутися до слайдів. 81 00:03:13,755 --> 00:03:15,200 ТОМАС Реймерс: Повернутися до слайдів. 82 00:03:15,200 --> 00:03:17,240 І Еллісон може взяти на себе. 83 00:03:17,240 --> 00:03:18,720 >> Аллісон Бухгольц-AU: Ву. 84 00:03:18,720 --> 00:03:19,220 ОК. 85 00:03:19,220 --> 00:03:22,360 Так що у вашому CSS файлі, Ви будете мати 86 00:03:22,360 --> 00:03:25,010 Багато з цих речей називається селектори. 87 00:03:25,010 --> 00:03:27,420 Це буде просто основа вашого CSS-файлу. 88 00:03:27,420 --> 00:03:29,480 Це просто буде багато і багато з них. 89 00:03:29,480 --> 00:03:30,780 Так селектор. 90 00:03:30,780 --> 00:03:32,649 Це просто загальна анатомія. 91 00:03:32,649 --> 00:03:35,190 Ми збираємося пройти через приклади, тому що, якщо ви, хлопці, ніколи не 92 00:03:35,190 --> 00:03:38,400 спостерігала за моїм розділ, я відчуваю, як речі в абстрактний 93 00:03:38,400 --> 00:03:39,400 насправді не має сенсу. 94 00:03:39,400 --> 00:03:41,110 Це завжди допомагає побачити приклади. 95 00:03:41,110 --> 00:03:42,420 >> Отже, ми маємо деякий селектор. 96 00:03:42,420 --> 00:03:49,120 Це збирається бути деякі ідентифікатор що ми хочемо стиль звернутися. 97 00:03:49,120 --> 00:03:52,220 І тоді ми можемо мати будь-яке набір правил і цінностей. 98 00:03:52,220 --> 00:03:55,680 Так селекторів, які ви могли б бачити може бути щось на зразок тіла, 99 00:03:55,680 --> 00:04:00,262 або пункт з P, або заголовок, або будь-який інший, 100 00:04:00,262 --> 00:04:02,000 все, що ви хочете, щоб ваші HTML-теги, щоб бути. 101 00:04:02,000 --> 00:04:03,570 >> Таким чином, в цьому випадку ми маємо тіло. 102 00:04:03,570 --> 00:04:06,985 І у нас є деякі правила, наскільки це відповідає 103 00:04:06,985 --> 00:04:09,610 те, що ваш стиль застосовується до. 104 00:04:09,610 --> 00:04:12,720 Так що в цьому випадку ми маємо Колір фону і вага шрифту. 105 00:04:12,720 --> 00:04:16,200 Так що це збирається змінити фон-небудь 106 00:04:16,200 --> 00:04:19,640 всередині тегів тіла нашого HTML файлу. 107 00:04:19,640 --> 00:04:22,810 І це буде давати це це світло-блакитний значення. 108 00:04:22,810 --> 00:04:24,820 >> Так що це збирається зробити фон блакитний. 109 00:04:24,820 --> 00:04:28,660 А потім що-небудь в тілі матиме вагу шрифту сміливий. 110 00:04:28,660 --> 00:04:31,142 Так що це просто збирається жирним шрифтом все нашого тексту. 111 00:04:31,142 --> 00:04:32,970 І це тільки один селектор. 112 00:04:32,970 --> 00:04:34,680 Але ви могли б дуже багато з них. 113 00:04:34,680 --> 00:04:38,730 І, як ми збираємося показати Через трохи більше про те, як 114 00:04:38,730 --> 00:04:40,709 що роботи й інші приклади там. 115 00:04:40,709 --> 00:04:41,750 Все, що ви хочете додати? 116 00:04:41,750 --> 00:04:42,499 >> ТОМАС Реймерс: Немає 117 00:04:42,499 --> 00:04:43,500 Еллісон отримав його. 118 00:04:43,500 --> 00:04:46,144 Ми просто будемо різати приклад тут, на нашому прикладі сайті. 119 00:04:46,144 --> 00:04:47,310 Отже, давайте насправді прийняти це. 120 00:04:47,310 --> 00:04:48,620 Це ідеально підходить. 121 00:04:48,620 --> 00:04:54,460 Так що я просто хочу, щоб скопіювати і вставити що прямо в нашу main.css файлу. 122 00:04:54,460 --> 00:04:56,530 І я йду, щоб врятувати його. 123 00:04:56,530 --> 00:04:59,190 І тоді ми будемо запускати його. 124 00:04:59,190 --> 00:05:01,600 Так примітка боку, один з найнеприємніших речей 125 00:05:01,600 --> 00:05:04,490 якщо ви не збережете файл, і то ви, начебто, перезавантажте сторінку, 126 00:05:04,490 --> 00:05:07,450 і т.п., чому не Зміна відбувається? 127 00:05:07,450 --> 00:05:07,950 Це буває. 128 00:05:07,950 --> 00:05:14,230 І ось ми побачили, що ми зробили наш сайт блакитний фон 129 00:05:14,230 --> 00:05:16,560 і деякі жирним шрифтом текст. 130 00:05:16,560 --> 00:05:20,730 >> Я повинен також згадати, якщо ви хлопці, є питання про що-небудь 131 00:05:20,730 --> 00:05:23,622 ми робимо, будь ласка безкоштовно, щоб зупинити нас і запитати нас. 132 00:05:23,622 --> 00:05:25,330 Ми повністю готові відповідати на запитання. 133 00:05:25,330 --> 00:05:27,951 134 00:05:27,951 --> 00:05:31,930 >> Аллісон Бухгольц-AU: Очевидно, що з CSS, все будується на собі. 135 00:05:31,930 --> 00:05:34,107 Так що, якщо одне не сенс зараз, ми 136 00:05:34,107 --> 00:05:35,690 не хочу, щоб докучати вам пізніше. 137 00:05:35,690 --> 00:05:38,390 138 00:05:38,390 --> 00:05:41,930 >> ТОМАС Реймерс: так давайте вид Проаналізуйте цей. 139 00:05:41,930 --> 00:05:44,210 Так ви хочете, щоб почати з селектором тут? 140 00:05:44,210 --> 00:05:45,979 >> Аллісон Бухгольц-AU: Так. 141 00:05:45,979 --> 00:05:48,270 Як я вже говорив раніше, тіло це просто наша вибору тут. 142 00:05:48,270 --> 00:05:50,950 Так що, якщо ми повернемося до нашої index-- ах. 143 00:05:50,950 --> 00:05:53,245 >> ТОМАС Реймерс: Який я просто закриті. 144 00:05:53,245 --> 00:05:54,530 Дайте мені секунду. 145 00:05:54,530 --> 00:05:58,286 Так Файл, Відкрити, index.html. 146 00:05:58,286 --> 00:05:59,410 Аллісон Бухгольц-AU: Круто. 147 00:05:59,410 --> 00:06:02,710 Так що, якщо ви помітили, тут ми Тобто ці теги тіла, чи не так? 148 00:06:02,710 --> 00:06:06,270 Так селектор раз відповідає теги, про які ми говоримо. 149 00:06:06,270 --> 00:06:07,670 Так тіло прямо тут. 150 00:06:07,670 --> 00:06:10,315 Отже, що ми хочемо сказати, everything-- ми можемо повернутися? 151 00:06:10,315 --> 00:06:12,065 Шкода, що я міг би просто як доторкнутися до екрана. 152 00:06:12,065 --> 00:06:14,410 Це було б так набагато прохолодніше. 153 00:06:14,410 --> 00:06:17,150 >> Так що нічого в тих теги тіла, які ми бачили 154 00:06:17,150 --> 00:06:19,637 просто, як, тексти, і організму в цілому 155 00:06:19,637 --> 00:06:20,970 відноситься до, як, на задньому плані. 156 00:06:20,970 --> 00:06:22,720 Якщо ви коли-небудь хотіли змінити фон, 157 00:06:22,720 --> 00:06:25,090 що буде в тезі тіла. 158 00:06:25,090 --> 00:06:27,120 Просто є такі правила, які застосовуються до них. 159 00:06:27,120 --> 00:06:32,040 >> Так що, якщо ми повинні були піти в index.html і-- насправді, 160 00:06:32,040 --> 00:06:33,840 у нас може бути щось поза тілом? 161 00:06:33,840 --> 00:06:37,340 Якби ми мали, начебто, підвал або то, вона не буде застосовувати до цього. 162 00:06:37,340 --> 00:06:40,900 Але нічого в Ці теги тіло буде 163 00:06:40,900 --> 00:06:44,960 можуть бути порушені цим органом селектор, який ми зробили. 164 00:06:44,960 --> 00:06:47,405 Так що, якщо ви були типу щось ще there-- 165 00:06:47,405 --> 00:06:49,400 >> ТОМАС Реймерс: Давайте їздити цей будинок. 166 00:06:49,400 --> 00:06:55,330 Так що, якщо у нас був div-- так що просто ще один тег ви можете мати. 167 00:06:55,330 --> 00:06:56,350 Я збираюся закрити його. 168 00:06:56,350 --> 00:06:58,280 Або давайте зробимо це пункт. 169 00:06:58,280 --> 00:07:01,430 Так р позначає пункті. 170 00:07:01,430 --> 00:07:02,560 І в цьому пункті. 171 00:07:02,560 --> 00:07:05,650 І тоді я кажу: "Це текст". 172 00:07:05,650 --> 00:07:06,369 Круто. 173 00:07:06,369 --> 00:07:09,160 І тоді я зробив це правило поширюється на У пункті замість тіла. 174 00:07:09,160 --> 00:07:12,390 175 00:07:12,390 --> 00:07:17,320 Ви побачите, як воно відноситься тільки до новостворених пункт, праворуч, 176 00:07:17,320 --> 00:07:18,892 не всі це. 177 00:07:18,892 --> 00:07:20,090 Чи має це сенс? 178 00:07:20,090 --> 00:07:21,840 >> Аллісон Бухгольц-AU: Так що це все тіло, 179 00:07:21,840 --> 00:07:24,450 але тепер наша вибору просто відповідає пункту. 180 00:07:24,450 --> 00:07:27,050 Таким чином, ми просто повинні жирним синім шрифтом для цього конкретного пункту, 181 00:07:27,050 --> 00:07:30,760 бо це єдине, який укладено всередині тега р. 182 00:07:30,760 --> 00:07:35,349 >> ТОМАС Реймерс: Чи є якийсь сенс кшталт про те, як речі инкапсуляции інші речі? 183 00:07:35,349 --> 00:07:38,140 Аллісон Бухгольц-AU: Крім того, тільки сказати, начебто, один з кращих способів 184 00:07:38,140 --> 00:07:40,889 щоб дійсно отримати комфортно з CSS це просто зробити щось на зразок цього, 185 00:07:40,889 --> 00:07:42,050 просто спробуйте його. 186 00:07:42,050 --> 00:07:46,700 Це дуже просто щось типу , Вдарив Оновити, щоб побачити, що відбувається. 187 00:07:46,700 --> 00:07:48,940 І як з більшістю CS, експериментування може часто 188 00:07:48,940 --> 00:07:51,790 привести до набагато краще інтуїтивне розуміння. 189 00:07:51,790 --> 00:07:54,432 Навіть більше, ніж нас просто, як, розмовляючи з вами. 190 00:07:54,432 --> 00:07:58,350 >> ТОМАС Реймерс: Абсолютно 100% згодні з цим. 191 00:07:58,350 --> 00:08:02,430 Так що, якщо ми повернемося до цього, давайте почнемо розсікає саме те, що ці два робити. 192 00:08:02,430 --> 00:08:04,550 Отже, ми маємо два правила на цей рахунок. 193 00:08:04,550 --> 00:08:07,420 Так перша це колір фону. 194 00:08:07,420 --> 00:08:10,590 І ви бачите, що ми встановили його рівним значенню, світло-блакитний. 195 00:08:10,590 --> 00:08:15,009 >> Таким чином, в CSS, CSS є свого роду дуже пухких про те, як 196 00:08:15,009 --> 00:08:16,300 Ви дозволили визначити колір. 197 00:08:16,300 --> 00:08:17,800 Таким чином, ви можете визначити їх по імені. 198 00:08:17,800 --> 00:08:20,650 Ви також можете зробити щось на зразок "червоного". 199 00:08:20,650 --> 00:08:25,270 І потім, якщо ми повернемося до цього, Ви побачите, що фон червоний. 200 00:08:25,270 --> 00:08:29,040 Ви також можете отримати really-- Я думаю, що ви можна отримати досить творча з цим, 201 00:08:29,040 --> 00:08:29,540 ви не можете? 202 00:08:29,540 --> 00:08:31,170 >> Аллісон Бухгольц-AU: Я думаю, ви можете використовувати Hex. 203 00:08:31,170 --> 00:08:31,250 Ви не можете? 204 00:08:31,250 --> 00:08:32,083 >> ТОМАС Реймерс: Так. 205 00:08:32,083 --> 00:08:32,969 Таким чином, ви можете використовувати Hex. 206 00:08:32,969 --> 00:08:34,490 Але я думаю, ім'я-мудрий. 207 00:08:34,490 --> 00:08:35,385 Не існує? 208 00:08:35,385 --> 00:08:37,260 Аллісон Бухгольц-AU: Ви можете зробити досить мало. 209 00:08:37,260 --> 00:08:43,350 Досить багато, як і більшість квітів, які ви може name-- як, я думаю, лосось є одним. 210 00:08:43,350 --> 00:08:45,322 >> ТОМАС Реймерс: Ми збираємося спробувати лосося. 211 00:08:45,322 --> 00:08:47,530 Аллісон Бухгольц-AU: Я думаю, зеленувато-жовті знаходиться в там. 212 00:08:47,530 --> 00:08:48,050 ТОМАС Реймерс: Так. 213 00:08:48,050 --> 00:08:48,550 Побачити? 214 00:08:48,550 --> 00:08:50,080 Таким чином, ви можете отримати досить творча. 215 00:08:50,080 --> 00:08:52,246 >> Аллісон Бухгольц-AU: Ви може отримати досить творча. 216 00:08:52,246 --> 00:08:55,750 Мовляв, якщо ви можете думати про назва кольору, ймовірно, це там. 217 00:08:55,750 --> 00:08:57,840 Якщо ви дійсно хочете добре детально, ви можете піти Hex. 218 00:08:57,840 --> 00:08:58,673 >> ТОМАС Реймерс: Так. 219 00:08:58,673 --> 00:08:59,390 Так шестнадцатеричной. 220 00:08:59,390 --> 00:09:05,280 Якщо ви, хлопці, пам'ятаєте цю спину зі старого PSET, зображення Відновлення, 221 00:09:05,280 --> 00:09:08,300 ви, хлопці, повинні були мати справу з цих шістнадцяткові значення. 222 00:09:08,300 --> 00:09:15,280 І начебто резюмувати, що це таке, Hex має три значення, що зберігаються в ньому. 223 00:09:15,280 --> 00:09:17,250 Так що це в групи по два кроком. 224 00:09:17,250 --> 00:09:19,300 Перші два представляють значення червоного. 225 00:09:19,300 --> 00:09:22,420 Другий являє значення зеленого. 226 00:09:22,420 --> 00:09:25,020 І останній з яких є синій? 227 00:09:25,020 --> 00:09:30,050 >> Так FF відбувається представляють шестнадцатеричное 255. 228 00:09:30,050 --> 00:09:35,480 Таким чином, ви повинні 255 червоний, 255 зелений і синій колір 0. 229 00:09:35,480 --> 00:09:37,670 І значення в діапазоні від 0 до 255. 230 00:09:37,670 --> 00:09:38,350 >> АУДИТОРІЯ: Так. 231 00:09:38,350 --> 00:09:41,472 Так по суті, ми могли б шукати Інтернет для будь-якого кольору ми хочемо, 232 00:09:41,472 --> 00:09:43,912 і визначити насправді відомо, колір комбінований спектр, 233 00:09:43,912 --> 00:09:45,130 і тоді ми могли б покласти його в? 234 00:09:45,130 --> 00:09:46,380 Аллісон Бухгольц-AU: Абсолютно вірно. 235 00:09:46,380 --> 00:09:52,900 Так що ви повинні в значній мірі повний контроль за кольори, які ви хочете в CSS. 236 00:09:52,900 --> 00:09:55,069 Ми будемо говорити про фонові зображення пізніше? 237 00:09:55,069 --> 00:09:56,110 Чи ми хочемо, щоб це зробити? 238 00:09:56,110 --> 00:09:56,240 >> ТОМАС Реймерс: Так. 239 00:09:56,240 --> 00:09:57,010 Абсолютно вірно. 240 00:09:57,010 --> 00:10:00,830 Отже, спочатку, просто щоб показати, що червоний і зелений-жовтий. 241 00:10:00,830 --> 00:10:03,120 І якщо Вам потрібна якась допомога в пошуку цього, ви 242 00:10:03,120 --> 00:10:05,575 Чи може Google щось як "кольору палітри." 243 00:10:05,575 --> 00:10:07,200 Аллісон Бухгольц-AU: О, це дуже добре. 244 00:10:07,200 --> 00:10:09,090 Я люблю Color Picker. 245 00:10:09,090 --> 00:10:11,360 >> ТОМАС Реймерс: colorpicker.com є гарним прикладом. 246 00:10:11,360 --> 00:10:14,580 І ось, ви побачите, що у вас є повний Photoshop, як вибір кольору. 247 00:10:14,580 --> 00:10:14,920 >> Аллісон Бухгольц-AU: Мм-ом. 248 00:10:14,920 --> 00:10:16,980 Крім того, класні речі ти може генерувати колірні схеми 249 00:10:16,980 --> 00:10:18,896 так що вам не доведеться, як, стикаючись кольору. 250 00:10:18,896 --> 00:10:22,780 ТОМАС Реймерс: А потім ось шістнадцяткове значення тут. 251 00:10:22,780 --> 00:10:27,800 Таким чином, ви завжди можете знайти на сайті в основному місць, щоб отримати шістнадцяткове значення від. 252 00:10:27,800 --> 00:10:31,667 Це не сортувати того, що просто, як ми бачити кольори світу в цифрах. 253 00:10:31,667 --> 00:10:34,000 Це більше, що ми йдемо на сайті і знайти те, що колір, який ми хочемо, 254 00:10:34,000 --> 00:10:36,850 а потім взяти цифру. 255 00:10:36,850 --> 00:10:39,590 Тому що це просто дуже легко спосіб посилатися речі в CS. 256 00:10:39,590 --> 00:10:40,350 >> Аллісон Бухгольц-AU: А тут ще also-- 257 00:10:40,350 --> 00:10:41,630 Я забув точну назву сайту. 258 00:10:41,630 --> 00:10:43,838 Але є, безумовно, я думаю, щось від Adobe 259 00:10:43,838 --> 00:10:48,350 що створює колірні схеми для вас, яка насправді здорово, тому що ви 260 00:10:48,350 --> 00:10:50,580 definitely-- це іноді важко зрозуміти ,, 261 00:10:50,580 --> 00:10:53,729 Ах, якби я хочу використовувати цей колір, що може бути ще корисним 262 00:10:53,729 --> 00:10:56,395 використовувати в іншому місці на моєму сайті, щоб, як, зробити його гарним і згуртованою. 263 00:10:56,395 --> 00:11:00,430 264 00:11:00,430 --> 00:11:04,260 >> ТОМАС Реймерс: Allison говорить про один за Adobe називається Kuler, я думаю. 265 00:11:04,260 --> 00:11:04,885 Це К-У-Л-Е-Р. 266 00:11:04,885 --> 00:11:06,259 Аллісон Бухгольц-AU: Я так думаю. 267 00:11:06,259 --> 00:11:07,610 Я впевнений, що це один. 268 00:11:07,610 --> 00:11:11,050 >> ТОМАС Реймерс: Мій фаворит завжди Колірна схема конструктора. 269 00:11:11,050 --> 00:11:13,998 >> Аллісон Бухгольц-AU: Ох. 270 00:11:13,998 --> 00:11:16,010 >> ТОМАС Реймерс: Що now-- 271 00:11:16,010 --> 00:11:16,860 >> Аллісон Бухгольц-AU: Ах, це красиво. 272 00:11:16,860 --> 00:11:18,818 >> ТОМАС Реймерс: А ви в принципі може сказати, як, 273 00:11:18,818 --> 00:11:21,700 Хочу три кольору поруч один з одним. 274 00:11:21,700 --> 00:11:25,030 І тоді давайте зробимо що-небудь хороше. 275 00:11:25,030 --> 00:11:29,210 І тоді ви можете отримати приклад що це може виглядати. 276 00:11:29,210 --> 00:11:32,470 І потім, якщо ви наведіть курсор миші на будь-який з їх, це дає вам шістнадцяткове значення. 277 00:11:32,470 --> 00:11:35,010 >> Так само, як хороший спосіб, щоб почати думати про колірних схем 278 00:11:35,010 --> 00:11:39,570 або які кольори в веб-сайт може йти добре разом. 279 00:11:39,570 --> 00:11:45,655 Тому що це може бути дивно не так легко підібрати, як ви думаєте. 280 00:11:45,655 --> 00:11:48,280 А потім інші цікаві речі Я завжди вважав, про цей сайт 281 00:11:48,280 --> 00:11:51,480 якщо ви потрапили приклади, це буде Показати, що приклад сайт 282 00:11:51,480 --> 00:11:54,800 може виглядати з використанням цього кольорову схему. 283 00:11:54,800 --> 00:11:56,270 У будь-якому випадку. 284 00:11:56,270 --> 00:11:57,863 >> Повернутися до фактичного CSS. 285 00:11:57,863 --> 00:12:01,112 Аллісон Бухгольц-AU: Але очевидно, що ми знаю, що ці посилання можуть бути корисними. 286 00:12:01,112 --> 00:12:03,195 ТОМАС Реймерс: Ні, вони безумовно, може бути корисним. 287 00:12:03,195 --> 00:12:04,720 Таким чином, друге правило, Еллісон? 288 00:12:04,720 --> 00:12:05,844 >> Аллісон Бухгольц-AU: Так. 289 00:12:05,844 --> 00:12:08,280 Друге правило це просто відповідна нашого шрифту. 290 00:12:08,280 --> 00:12:11,520 Так вага шрифту просто якась of-- так вага буде 291 00:12:11,520 --> 00:12:15,220 бути, якщо ви хочете просто, як, нормальний або, як більш тонкі шрифти, 292 00:12:15,220 --> 00:12:17,251 або в даному випадку, як, виділені жирним шрифтом. 293 00:12:17,251 --> 00:12:17,750 Я забув. 294 00:12:17,750 --> 00:12:21,557 Що, якщо ви хочете it-- є тонше один більше, ніж просто, як, нормально? 295 00:12:21,557 --> 00:12:24,140 ТОМАС Реймерс: Я насправді не знати, якщо є більш тонкою. 296 00:12:24,140 --> 00:12:24,680 Аллісон Бухгольц-AU: Я забув. 297 00:12:24,680 --> 00:12:26,300 Так шрифту вага ми, як правило, просто використовувати для напівжирним шрифтом. 298 00:12:26,300 --> 00:12:29,010 Якщо ви хочете отримати дійсно в це, ми збираємося показати вам. 299 00:12:29,010 --> 00:12:34,317 W3Schools є всі різні речі, які ви можете зробити для шрифтів. 300 00:12:34,317 --> 00:12:36,900 Але в принципі, якщо ви хочете нічого змінювати про шрифт, 301 00:12:36,900 --> 00:12:39,330 це завжди буде, як, шрифт-то. 302 00:12:39,330 --> 00:12:43,450 Так це буде, як, сімейства шрифтів, якщо ви намагається змінити фактичний тип. 303 00:12:43,450 --> 00:12:47,390 Це буде стиль шрифту, якщо вас хочу зробити це як прописом, 304 00:12:47,390 --> 00:12:49,710 або курсив, або ще багато чого. 305 00:12:49,710 --> 00:12:53,570 Або навіть колір шрифту, якщо ми хотіли, щоб змінити це. 306 00:12:53,570 --> 00:12:55,621 >> ТОМАС Реймерс: Так. 307 00:12:55,621 --> 00:12:56,925 Таким чином, ви можете змінити це. 308 00:12:56,925 --> 00:12:59,360 І начебто просто Резюме зараз, так що ви можете 309 00:12:59,360 --> 00:13:01,400 бачити, що у нас є селектор тут. 310 00:13:01,400 --> 00:13:03,000 У нас є ці фігурні дужки. 311 00:13:03,000 --> 00:13:06,735 І тоді у нас є правила розділених крапкою з комою. 312 00:13:06,735 --> 00:13:08,100 Чи має це сенс? 313 00:13:08,100 --> 00:13:09,130 Так? 314 00:13:09,130 --> 00:13:10,500 Круто. 315 00:13:10,500 --> 00:13:13,200 Так що, якщо це good-- 316 00:13:13,200 --> 00:13:14,424 >> Аллісон Бухгольц-AU: Назад. 317 00:13:14,424 --> 00:13:17,590 ТОМАС Реймерс: Давайте говорити конкретно про те, які селектори у нас є. 318 00:13:17,590 --> 00:13:19,790 "Тому що зараз ми в начебто тільки що показали міток. 319 00:13:19,790 --> 00:13:21,696 Але ви, хлопці, могли бачити, що це правдоподібно. 320 00:13:21,696 --> 00:13:23,570 Скажімо, у вас є два пункти, на сторінці, і ви 321 00:13:23,570 --> 00:13:26,087 хочу, щоб мати можливість стилю один, але не інший, 322 00:13:26,087 --> 00:13:29,170 Ви не просто хочете обмежувати себе доведеться використовувати інший поточний HTML 323 00:13:29,170 --> 00:13:33,410 теги, щоб дати їм різні стилі. 324 00:13:33,410 --> 00:13:35,995 >> Отже, ми маємо три основних типи селекторів. 325 00:13:35,995 --> 00:13:37,120 Аллісон Бухгольц-AU: Так. 326 00:13:37,120 --> 00:13:39,828 Отже, ми маємо тег, що і ми говорили про прямо зараз. 327 00:13:39,828 --> 00:13:42,430 Так що ніби як на тіло або р. 328 00:13:42,430 --> 00:13:46,280 А то у нас клас, який є коли ми визначаємо його в нашому CSS файлі, 329 00:13:46,280 --> 00:13:49,907 це завжди буде точка, незалежно від Ви хочете ім'я вашого класу було. 330 00:13:49,907 --> 00:13:51,490 І це може застосовуватися до кількох речей. 331 00:13:51,490 --> 00:13:54,610 332 00:13:54,610 --> 00:13:57,610 >> Скажімо, у вас є п'ять пунктів і два з трьох з них 333 00:13:57,610 --> 00:14:00,580 повинні бути оформлені так само, ви б застосувати клас до нього. 334 00:14:00,580 --> 00:14:03,040 І це тільки, як ми робимо це. 335 00:14:03,040 --> 00:14:05,600 Ми дамо вам приклад де це насправді показує вгору. 336 00:14:05,600 --> 00:14:11,030 Але якщо у вас, можливо, деякі тег р, після нього, можна було б написати, 337 00:14:11,030 --> 00:14:14,170 клас дорівнює будь-якій зручній класи Ви хочете, щоб застосувати до нього. 338 00:14:14,170 --> 00:14:19,280 Тому, що б клас селектори, які ми хочемо застосувати до цього конкретного пункту, 339 00:14:19,280 --> 00:14:21,300 ми могли б просто написати, як це. 340 00:14:21,300 --> 00:14:24,080 Звичайно, я думаю, приклад зробить це набагато більш конкретними. 341 00:14:24,080 --> 00:14:27,270 >> Інший у нас є це ID, який ми позначимо 342 00:14:27,270 --> 00:14:29,707 хеш, або фунта, або хештегом. 343 00:14:29,707 --> 00:14:30,790 ТОМАС Реймерс: знак числа. 344 00:14:30,790 --> 00:14:32,430 Аллісон Бухгольц-AU: знак числа. 345 00:14:32,430 --> 00:14:34,550 Це працює, теж. 346 00:14:34,550 --> 00:14:36,640 А це має бути дійсно унікальним. 347 00:14:36,640 --> 00:14:39,880 Вони повинні застосовуватися тільки до одне на вашій сторінці. 348 00:14:39,880 --> 00:14:43,820 Так от, чи є конкретний пункт, або який-небудь елемент у списку, або будь-який інший, 349 00:14:43,820 --> 00:14:45,090 це має бути унікальним. 350 00:14:45,090 --> 00:14:48,730 І таким же чином, що ми просто сказати, як, клас = "class1 class2," 351 00:14:48,730 --> 00:14:51,577 це може бути просто ідентифікатор, що ми є. 352 00:14:51,577 --> 00:14:52,410 ТОМАС Реймерс: Так. 353 00:14:52,410 --> 00:14:54,330 Так що давайте, безумовно, говорити про приклади тут. 354 00:14:54,330 --> 00:14:58,170 І я просто хочу, щоб зануритися прямо назад в коді. 355 00:14:58,170 --> 00:15:02,090 Отже, давайте подивимося на наш HTML. 356 00:15:02,090 --> 00:15:03,960 І тому ми зараз є один пункт. 357 00:15:03,960 --> 00:15:05,510 Цей текст. 358 00:15:05,510 --> 00:15:09,151 Я просто хочу, щоб змінити це. "Цей текст 1." 359 00:15:09,151 --> 00:15:11,150 А потім ми збираємося є "Цей текст 2." 360 00:15:11,150 --> 00:15:12,525 >> Аллісон Бухгольц-AU: другий. 361 00:15:12,525 --> 00:15:13,540 ТОМАС Реймерс: Так. 362 00:15:13,540 --> 00:15:16,810 Таким чином, ми тепер маємо "Цей текст 2", чи не так? 363 00:15:16,810 --> 00:15:21,560 І ми збираємося, щоб побачити, що якщо ми перезавантажити сторінка, те, що ми збираємося знайти 364 00:15:21,560 --> 00:15:23,067 що ми збираємося find-- 365 00:15:23,067 --> 00:15:24,150 Аллісон Бухгольц-AU: Ох. 366 00:15:24,150 --> 00:15:24,983 ТОМАС Реймерс: Так. 367 00:15:24,983 --> 00:15:27,570 Ми збираємося, щоб знайти "Це Текст 1 ", і" Цей текст 2. " 368 00:15:27,570 --> 00:15:28,650 >> Аллісон Бухгольц-AU: І з прекрасний жовтий колір. 369 00:15:28,650 --> 00:15:31,066 >> ТОМАС Реймерс: І ви побачите, що наша вибору прямо зараз, 370 00:15:31,066 --> 00:15:34,940 який відноситься до р, або абзаци, впливає на них обох, 371 00:15:34,940 --> 00:15:38,700 тому що обидва вони відповідають умови, що вони обидва р тегів. 372 00:15:38,700 --> 00:15:40,360 Це робить повний сенс. 373 00:15:40,360 --> 00:15:43,340 Так питання в тому, добре, що якщо ми хочемо отримати тільки один? 374 00:15:43,340 --> 00:15:46,350 Так само, як Еллісон говорив, у нас є два інших способи зробити це. 375 00:15:46,350 --> 00:15:47,320 Я збираюся почати з ідентифікатором. 376 00:15:47,320 --> 00:15:48,405 >> Аллісон Бухгольц-AU: Давайте почнемо з ідентифікатором. 377 00:15:48,405 --> 00:15:50,405 >> ТОМАС Реймерс: І як з них є атрибутами. 378 00:15:50,405 --> 00:15:53,200 Так атрибути існують в HTML. 379 00:15:53,200 --> 00:15:55,600 І те, що вони є, те, що ви додаєте 380 00:15:55,600 --> 00:15:58,840 всередині тега, який окремо від імені тега. 381 00:15:58,840 --> 00:16:01,301 Таким чином, ви можете мати кілька атрибутів. 382 00:16:01,301 --> 00:16:01,800 Так? 383 00:16:01,800 --> 00:16:03,950 >> Аллісон Бухгольц-AU: Я саме збирався сказати, з вашого прикладу з PSET 7, 384 00:16:03,950 --> 00:16:06,650 якщо кожен з вас намагаються вирівняти речі від центру, 385 00:16:06,650 --> 00:16:08,550 Ви могли б використовувати "Текст приєднуються = центр». 386 00:16:08,550 --> 00:16:10,550 І ви це помітили, напевно, повинні були зосереджені 387 00:16:10,550 --> 00:16:12,650 Ваш текст або ваш навігаційної панелі. 388 00:16:12,650 --> 00:16:15,499 Так от якраз і атрибут що ви можете бути знайомі з. 389 00:16:15,499 --> 00:16:18,040 ТОМАС Реймерс: Там купа атрибутів, які ви побачите. 390 00:16:18,040 --> 00:16:18,539 Так. 391 00:16:18,539 --> 00:16:21,250 Як і хороший посиланням на PSET 7. 392 00:16:21,250 --> 00:16:23,150 У нас є ідентифікатор. 393 00:16:23,150 --> 00:16:25,080 Ви також можете мати клас, подібні речі. 394 00:16:25,080 --> 00:16:27,250 Один тег може мати багато атрибутів. 395 00:16:27,250 --> 00:16:33,140 Так, починаючи з ідентифікатором, давайте уявимо, що ми хочете мати ідентифікатор of-- я не знаю. 396 00:16:33,140 --> 00:16:35,140 Ми будемо називати його особливим, бо це одне, ми 397 00:16:35,140 --> 00:16:37,867 збирається зробити сміливий, і підкреслення і що завгодно. 398 00:16:37,867 --> 00:16:39,950 Аллісон Бухгольц-AU: Це буду дуже особливе. 399 00:16:39,950 --> 00:16:42,360 ТОМАС Реймерс: Так що це Один з них, у нас є документа особливе. 400 00:16:42,360 --> 00:16:48,140 Таким чином, спосіб вибору, що, таким чином, є в main.css, а не є р тег, 401 00:16:48,140 --> 00:16:51,500 ви #special, добре? 402 00:16:51,500 --> 00:16:55,538 І, що вибирає що з ідентифікатором особливе. 403 00:16:55,538 --> 00:16:57,295 Чи має це сенс для всіх? 404 00:16:57,295 --> 00:16:57,920 АУДИТОРІЯ: Так. 405 00:16:57,920 --> 00:16:59,110 ТОМАС Реймерс: Круто. 406 00:16:59,110 --> 00:17:04,440 Отже, якщо ми повернемося, ми see-- вигуки. 407 00:17:04,440 --> 00:17:06,240 Так. 408 00:17:06,240 --> 00:17:09,460 Ми побачимо, що це всього лише вибирає один з ідентифікатором особливе. 409 00:17:09,460 --> 00:17:10,622 Так? 410 00:17:10,622 --> 00:17:11,900 Звучить здорово. 411 00:17:11,900 --> 00:17:12,570 Так. 412 00:17:12,570 --> 00:17:15,456 >> Залу: Можна щось є атрибутом як клас та ідентифікаційний? 413 00:17:15,456 --> 00:17:16,359 >> ТОМАС Реймерс: Так. 414 00:17:16,359 --> 00:17:16,900 АУДИТОРІЯ: OK. 415 00:17:16,900 --> 00:17:20,887 І тоді те, що станеться, якщо ви потім дати це якісь правила в CSS, що конфлікт? 416 00:17:20,887 --> 00:17:21,970 ТОМАС Реймерс: Абсолютно вірно. 417 00:17:21,970 --> 00:17:23,940 Ми безумовно збираємося щоб говорити про це. 418 00:17:23,940 --> 00:17:31,890 Так саме те, що ви отримуєте на, ви також можете мати класи. 419 00:17:31,890 --> 00:17:36,380 Отже, давайте уявимо, що в мене було три пункти, і я 420 00:17:36,380 --> 00:17:38,730 хотів стилізувати перший два, але не третім. 421 00:17:38,730 --> 00:17:42,850 Ну, ваша перша думка може бути, ну, я може просто дати другий ідентифікатор. 422 00:17:42,850 --> 00:17:45,590 Але ви не можете, бо ідентифікатором, так само, як Еллісон говорив, 423 00:17:45,590 --> 00:17:47,330 повинен бути унікальним. 424 00:17:47,330 --> 00:17:50,860 >> Таким чином, замість ID, то, що ви можна використовувати, що ви можете використовувати клас. 425 00:17:50,860 --> 00:17:57,880 І class--, що вона дозволяє Ви зробити, це в основному говорять, 426 00:17:57,880 --> 00:17:59,610 це відноситься як частина групи. 427 00:17:59,610 --> 00:18:02,410 У цьому випадку, наша група називається Special. 428 00:18:02,410 --> 00:18:06,500 І те, що ми збираємося зробити, це ми збираємося say--, а не фунт, 429 00:18:06,500 --> 00:18:08,070 ми збираємося використовувати точку. 430 00:18:08,070 --> 00:18:08,740 ОК? 431 00:18:08,740 --> 00:18:11,950 І зауважте, що фунт і крапка існують тільки у файлі CSS, 432 00:18:11,950 --> 00:18:12,797 не в HTML. 433 00:18:12,797 --> 00:18:13,880 Аллісон Бухгольц-AU: Так. 434 00:18:13,880 --> 00:18:15,185 Важлива відмінність. 435 00:18:15,185 --> 00:18:17,510 >> ТОМАС Реймерс: У мене є було стільки боротьби, 436 00:18:17,510 --> 00:18:23,990 бо я поставив хеш в HTML і то просто відчував себе дурним протягом тривалого часу. 437 00:18:23,990 --> 00:18:27,470 Подивіться, як він вибирає обидва ті, з цього класу? 438 00:18:27,470 --> 00:18:28,210 Круто. 439 00:18:28,210 --> 00:18:29,950 >> Тепер, все може мати кілька класів. 440 00:18:29,950 --> 00:18:32,790 Скажімо, я хотів, щоб перший два мають фон жовтого 441 00:18:32,790 --> 00:18:36,770 і два мають колір шрифту блакитний. 442 00:18:36,770 --> 00:18:37,270 ОК. 443 00:18:37,270 --> 00:18:39,735 Я дійсно не знаю, чому я хочу зробити це, але я не можу. 444 00:18:39,735 --> 00:18:42,401 >> Аллісон Бухгольц-AU: не могли б рекомендував його для вашого веб-сайту. 445 00:18:42,401 --> 00:18:43,880 Але для наших цілей, він буде робити. 446 00:18:43,880 --> 00:18:46,294 >> ТОМАС Реймерс: Це не хороший кольоровій гамі. 447 00:18:46,294 --> 00:18:49,210 Аллісон Бухгольц-AU: Ну, жовтий і синій мої високі квітів школі. 448 00:18:49,210 --> 00:18:50,947 Я не знаю, хоча. 449 00:18:50,947 --> 00:18:53,530 ТОМАС Реймерс: Allison хай школа мала великий колірну схему. 450 00:18:53,530 --> 00:18:54,520 [Сміх] 451 00:18:54,520 --> 00:18:59,120 Отже, що ми можемо назвати це Давайте назвемо this-- так у нас є спеціальні 452 00:18:59,120 --> 00:19:00,030 і у нас є досить. 453 00:19:00,030 --> 00:19:02,405 Я пропоную, для цього потрібно використовувати набагато більш описові імена. 454 00:19:02,405 --> 00:19:05,820 Аллісон Бухгольц-AU: Так, я б назвати це, начебто, жовтого або синього кольору. 455 00:19:05,820 --> 00:19:08,314 >> ТОМАС Реймерс: Ми не дійсно вносить реальний веб-сайт, 456 00:19:08,314 --> 00:19:09,730 який є, чому ми цього не робимо. 457 00:19:09,730 --> 00:19:11,521 Але якщо ви насправді був реальний веб-сайт, ви 458 00:19:11,521 --> 00:19:16,220 могли б мати, як, стаття заголовок, зміст статті, перше слово, 459 00:19:16,220 --> 00:19:21,920 такі речі, які дозволяють Вам буде набагато більш наочним. 460 00:19:21,920 --> 00:19:23,550 Це дійсно подібно змінним. 461 00:19:23,550 --> 00:19:28,390 Вони повинні бути названі в дорозі, де Ви можете, like-- так, як такої. 462 00:19:28,390 --> 00:19:29,470 Ідеально підходить. 463 00:19:29,470 --> 00:19:30,480 >> Так колір фону. 464 00:19:30,480 --> 00:19:35,920 І тоді ми будемо say-- так спосіб змінити колір це просто "колір". 465 00:19:35,920 --> 00:19:38,412 І ми збираємося зробити це синій. 466 00:19:38,412 --> 00:19:40,150 Це круто. 467 00:19:40,150 --> 00:19:42,640 Так що тепер у нас є Перші два мають особливе. 468 00:19:42,640 --> 00:19:45,972 Наступна одним збирається є "клас = красиво." 469 00:19:45,972 --> 00:19:49,180 Аллісон Бухгольц-AU: І тоді ви будете Щоб додати "досить" до середньої. 470 00:19:49,180 --> 00:19:49,971 ТОМАС Реймерс: Так. 471 00:19:49,971 --> 00:19:52,970 А потім в середнє, додати "досить", те, що відбувається 472 00:19:52,970 --> 00:19:56,880 це у вас є тільки простір. 473 00:19:56,880 --> 00:19:59,800 Так атрибута класу є розділений пробілами список 474 00:19:59,800 --> 00:20:02,450 всіх класів які ставляться до цього тегу. 475 00:20:02,450 --> 00:20:02,959 ОК? 476 00:20:02,959 --> 00:20:05,750 Це не як цей належить якась спеціальний клас 477 00:20:05,750 --> 00:20:07,180 "Особливий, простір, досить." 478 00:20:07,180 --> 00:20:10,870 Він належить до двох classes-- спеціальної і досить. 479 00:20:10,870 --> 00:20:12,492 Так? 480 00:20:12,492 --> 00:20:14,360 Круто. 481 00:20:14,360 --> 00:20:17,010 >> І потім, якщо ми подивимося на те, що відбувається, ми 482 00:20:17,010 --> 00:20:21,850 побачимо, що перший має жовтий фон, чорний текст. 483 00:20:21,850 --> 00:20:22,450 По-друге одно-- 484 00:20:22,450 --> 00:20:26,160 >> Аллісон Бухгольц-AU: --has жирним шрифтом жовтий фон з синім текстом. 485 00:20:26,160 --> 00:20:29,330 І наша остання просто має синій текст, який ми призначили до нього. 486 00:20:29,330 --> 00:20:30,870 >> ТОМАС Реймерс: Cool? 487 00:20:30,870 --> 00:20:32,491 Як селектори працює? 488 00:20:32,491 --> 00:20:32,990 Високий. 489 00:20:32,990 --> 00:20:34,720 >> Аллісон Бухгольц-AU: Ми хочемо зробити говорити про конфлікт зараз, то? 490 00:20:34,720 --> 00:20:35,780 >> ТОМАС Реймерс: Так що так. 491 00:20:35,780 --> 00:20:36,310 Абсолютно вірно. 492 00:20:36,310 --> 00:20:38,380 Що трапиться, якщо вас є конфлікт, чи не так? 493 00:20:38,380 --> 00:20:44,740 Давайте уявимо, що перший встановлює щось like-- 494 00:20:44,740 --> 00:20:47,240 Аллісон Бухгольц-AU: Може бути, Це один змінює фон? 495 00:20:47,240 --> 00:20:48,090 ТОМАС Реймерс: Так. 496 00:20:48,090 --> 00:20:51,699 Так що ми збираємося зробити "досить" змінити фон на лосося. 497 00:20:51,699 --> 00:20:54,740 Аллісон Бухгольц-AU: Ви просто з всі великі кольору сьогодні, Томас. 498 00:20:54,740 --> 00:20:55,573 ТОМАС Реймерс: Так. 499 00:20:55,573 --> 00:20:58,200 Тому що я дізнався, що я можу використовувати лосося в реальному кольорі. 500 00:20:58,200 --> 00:21:00,270 Таким чином, ми тільки збираємося зробити це. 501 00:21:00,270 --> 00:21:01,770 Я також думаю, Захід реальний колір. 502 00:21:01,770 --> 00:21:03,103 АУДИТОРІЯ: Захід це реальний колір? 503 00:21:03,103 --> 00:21:04,572 Аллісон Бухгольц-AU: Давайте спробуємо це. 504 00:21:04,572 --> 00:21:07,735 ТОМАС Реймерс: Після цієї демонстрації тільки тому, що у випадку, якщо псує, 505 00:21:07,735 --> 00:21:08,943 Я не хочу, щоб налагодження. 506 00:21:08,943 --> 00:21:11,580 Отже, ми знаємо лосося реальний колір. 507 00:21:11,580 --> 00:21:15,626 Таким чином, будь здогадки по що станеться? 508 00:21:15,626 --> 00:21:17,522 >> Аллісон Бухгольц-AU: Будь-яка ідея? 509 00:21:17,522 --> 00:21:20,002 >> АУДИТОРІЯ: [нерозбірливо]. 510 00:21:20,002 --> 00:21:20,920 >> ТОМАС Реймерс: Так. 511 00:21:20,920 --> 00:21:22,150 Таким чином, ви отримали це точно. 512 00:21:22,150 --> 00:21:24,930 В основному, це відбувається Останнє правило, що воно було дано. 513 00:21:24,930 --> 00:21:27,860 >> Аллісон Бухгольц-AU: Так що це де каскадні набуває чинності. 514 00:21:27,860 --> 00:21:31,080 >> ТОМАС Реймерс: Так що пам'ятаєте, як ми було, що каскадні таблиці стилів? 515 00:21:31,080 --> 00:21:33,660 Отже, що ми якось означає, що у нас є купа правил 516 00:21:33,660 --> 00:21:37,115 які застосовуються на верхній частині один з одним, і вони можуть також перевизначити один з одним. 517 00:21:37,115 --> 00:21:39,380 >> Аллісон Бухгольц-AU: Так Що б не внизу 518 00:21:39,380 --> 00:21:41,540 скасовує все це на самому верху. 519 00:21:41,540 --> 00:21:45,842 Ви могли б правила, які повністю заперечувати те заздалегідь. 520 00:21:45,842 --> 00:21:48,300 Це також пояснює, чому ви хочете бути обережні, коли ви стилю, 521 00:21:48,300 --> 00:21:51,465 так що ви не створюєте правила, які Ви просто повністю перекриваючи. 522 00:21:51,465 --> 00:21:53,340 >> ТОМАС Реймерс: Або може бути, ви хочу, щоб перезаписати правила. 523 00:21:53,340 --> 00:21:53,920 >> Аллісон Бухгольц-AU: Або, може бути, ви робите. 524 00:21:53,920 --> 00:21:54,300 Так. 525 00:21:54,300 --> 00:21:57,175 >> ТОМАС Реймерс: Уявіть, що у вас є клас, який відноситься до більшості речей, 526 00:21:57,175 --> 00:22:01,220 але, скажімо, ви хочете змінити Колір фону на червоний, а також шрифту 527 00:22:01,220 --> 00:22:03,140 вага напівжирним шрифтом для найбільш речі, але для одного, 528 00:22:03,140 --> 00:22:06,098 Ви хочете тільки колір фону бути корисним, але ви хочете, щоб всі інші 529 00:22:06,098 --> 00:22:09,990 властивості, ви могли б зробити щось як "накреслення шрифту = нормальний," 530 00:22:09,990 --> 00:22:12,760 що б потім скасувати, що сміливий зміни. 531 00:22:12,760 --> 00:22:14,480 Так? 532 00:22:14,480 --> 00:22:17,250 Знову ж таки, кращий спосіб, я думаю, Еллісон сказав, що це, просто практикувати. 533 00:22:17,250 --> 00:22:18,080 >> Аллісон Бухгольц-AU: експериментування. 534 00:22:18,080 --> 00:22:20,090 >> ТОМАС Реймерс: практика, практика, практика і експеримент. 535 00:22:20,090 --> 00:22:22,950 Я знаю багато людей, які думають, що CSS це просто багато ворожіння і-перевірки 536 00:22:22,950 --> 00:22:25,580 Зрештою, де, якщо Ви хочете зробити something-- як, 537 00:22:25,580 --> 00:22:27,663 у вас є загальне уявлення, але Ви, мабуть, ще потрібно 538 00:22:27,663 --> 00:22:31,390 спробувати, щоб переконатися, Ви знаєте, як він виглядає. 539 00:22:31,390 --> 00:22:34,482 >> АУДИТОРІЯ: Коли ви претендуєте класи, більш один 540 00:22:34,482 --> 00:22:37,339 на той же пункт або розділ, робить це 541 00:22:37,339 --> 00:22:39,505 від того, що замовлення ви можете введіть їх у лапки? 542 00:22:39,505 --> 00:22:40,992 >> ТОМАС Реймерс: Ні, не на всіх. 543 00:22:40,992 --> 00:22:45,764 >> Аллісон Бухгольц-AU: Що має значення замовлення протягом вашого CSS стилів. 544 00:22:45,764 --> 00:22:47,430 АУДИТОРІЯ: Не могли б ви повторити питання? 545 00:22:47,430 --> 00:22:50,680 ТОМАС Реймерс: Ой. 546 00:22:50,680 --> 00:22:53,990 Аллісон Бухгольц-AU: В класу, коли ви даєте класи 547 00:22:53,990 --> 00:22:56,964 щось в HTML, що не це має значення, який порядок вони в? 548 00:22:56,964 --> 00:22:58,130 Це не має значення порядок. 549 00:22:58,130 --> 00:23:02,915 Важливо те, порядок Селектори класів у вашій CSS, 550 00:23:02,915 --> 00:23:04,306 в таблиці стилів. 551 00:23:04,306 --> 00:23:06,982 >> ТОМАС Реймерс: звук хороший? 552 00:23:06,982 --> 00:23:08,532 >> Аллісон Бухгольц-AU: Прекрасно. 553 00:23:08,532 --> 00:23:11,539 >> ТОМАС Реймерс: А потім ми будемо продовжувати to-- 554 00:23:11,539 --> 00:23:13,330 Аллісон Бухгольц-AU: Що ж ми маємо наступний? 555 00:23:13,330 --> 00:23:14,245 Я забув. 556 00:23:14,245 --> 00:23:16,087 О, ми просто маємо приклади. 557 00:23:16,087 --> 00:23:17,295 Але ми-то зробити ті. 558 00:23:17,295 --> 00:23:18,990 Ми зробили приклади на льоту. 559 00:23:18,990 --> 00:23:20,540 >> ТОМАС Реймерс: Ми отримуємо скоро об'єднати селектори. 560 00:23:20,540 --> 00:23:22,790 >> Аллісон Бухгольц-AU: О, ми отримуємо, щоб об'єднати селектори. 561 00:23:22,790 --> 00:23:25,260 ТОМАС Реймерс: Таким чином, деякі прикладів у нас є 562 00:23:25,260 --> 00:23:29,630 # Dog-- фунт, або хештег, або знак числа, або щось 563 00:23:29,630 --> 00:23:32,050 Ви хочете зателефонувати that-- різким. 564 00:23:32,050 --> 00:23:34,875 >> Аллісон Бухгольц-AU: Sharp собака. 565 00:23:34,875 --> 00:23:36,470 >> ТОМАС Реймерс: Тоді у вас є .pets. 566 00:23:36,470 --> 00:23:39,059 567 00:23:39,059 --> 00:23:41,600 Щось має свій ідентифікатор собаки, є тільки одна собака на сторінці. 568 00:23:41,600 --> 00:23:43,870 Щось є ідентифікатор кіт, є тільки одна кішка. 569 00:23:43,870 --> 00:23:45,665 Там може бути багато домашніх тварин на цій сторінці. 570 00:23:45,665 --> 00:23:47,570 Ось чому ми дали, що класи. 571 00:23:47,570 --> 00:23:48,740 У вас є приклад р. 572 00:23:48,740 --> 00:23:50,490 А потім, тому один з Останній приклад, який 573 00:23:50,490 --> 00:23:53,790 це те, що ми не говорили, те, що відбувається, коли ви поєднуєте їх. 574 00:23:53,790 --> 00:23:54,580 Так p.pets. 575 00:23:54,580 --> 00:23:57,510 576 00:23:57,510 --> 00:24:02,950 >> Таким чином, для того, давайте повернемося до код і ввести another-- так. 577 00:24:02,950 --> 00:24:04,290 Отже, повернемося сюди. 578 00:24:04,290 --> 00:24:04,850 >> Аллісон Бухгольц-AU: Я відчуваю, що це really-- 579 00:24:04,850 --> 00:24:08,105 як тільки переглядаючи приклади дійсно спосіб дізнатися це. 580 00:24:08,105 --> 00:24:09,360 Так ось, що ми робимо. 581 00:24:09,360 --> 00:24:14,030 >> ТОМАС Реймерс: Отже, давайте уявимо, що ми тільки хочу, щоб виділити текст 2, вірно? 582 00:24:14,030 --> 00:24:16,530 Таким чином, ми, безумовно, не може зробити це з ідентифікатором. 583 00:24:16,530 --> 00:24:19,620 Ну, ми могли б зробити це з ID, але це не має ID. 584 00:24:19,620 --> 00:24:22,490 Я міг би додати один, але давайте уявимо, що я не хочу, щоб додати один 585 00:24:22,490 --> 00:24:24,910 або вже є щось ще. 586 00:24:24,910 --> 00:24:26,516 Я не можу цього зробити з цим. 587 00:24:26,516 --> 00:24:28,870 Тег, безумовно, не єдиний, чи не так? 588 00:24:28,870 --> 00:24:30,670 І жоден не клас. 589 00:24:30,670 --> 00:24:32,314 Але ви можете комбінувати ці речі. 590 00:24:32,314 --> 00:24:35,230 Скажімо, ми хотіли зробити щось яке застосовується тільки до речей, 591 00:24:35,230 --> 00:24:39,420 є клас спеціальних і які мають клас досить. 592 00:24:39,420 --> 00:24:48,150 >> Так що ви можете зробити, це в main.css, Ви можете сказати, давайте спочатку видалити це. 593 00:24:48,150 --> 00:24:50,240 Ви можете комбінувати їх. 594 00:24:50,240 --> 00:24:51,430 Таким чином, ви можете зробити .special. 595 00:24:51,430 --> 00:24:52,110 немає місця. 596 00:24:52,110 --> 00:24:54,770 Просто .special.pretty. 597 00:24:54,770 --> 00:25:00,550 Що це означає, що щось який є одночасно спеціальних і красиво. 598 00:25:00,550 --> 00:25:01,900 Чи має це сенс? 599 00:25:01,900 --> 00:25:04,190 І якщо ми йдемо сюди, що Ви будете бачити 600 00:25:04,190 --> 00:25:09,734 це правило поширюється лише на Другий, який має як з них. 601 00:25:09,734 --> 00:25:11,400 І ви можете зробити, що для багатьох речей. 602 00:25:11,400 --> 00:25:13,270 Ви можете say-- давайте прикидатися, що я тільки хотів 603 00:25:13,270 --> 00:25:18,300 щоб робити речі, які мають клас гарненьку і який також пункт тега. 604 00:25:18,300 --> 00:25:19,920 Так p.pretty. 605 00:25:19,920 --> 00:25:23,585 Давайте уявимо, що в мене було щось дуже на тілі тега. 606 00:25:23,585 --> 00:25:25,850 ОК? 607 00:25:25,850 --> 00:25:28,490 Я можу запустити це, і я можна побачити, що це всього лише 608 00:25:28,490 --> 00:25:32,720 має намір звернутися в речах, які пункти з класом красиво. 609 00:25:32,720 --> 00:25:35,650 І ви можете комбінувати їх, в основному, як багато хто, як ви хочете. 610 00:25:35,650 --> 00:25:38,580 Таким чином, ви можете просто покласти їх разом. 611 00:25:38,580 --> 00:25:39,604 Чи має це сенс? 612 00:25:39,604 --> 00:25:41,770 Аллісон Бухгольц-AU: Так Цей вид є більш корисним, 613 00:25:41,770 --> 00:25:45,490 коли Томас говорив раніше, можливо, у вас є дуже складний сайт, 614 00:25:45,490 --> 00:25:48,050 і у вас вже є багато з цих правил, написаних, 615 00:25:48,050 --> 00:25:51,170 і вам просто потрібно, щоб об'єднати два з раніше. 616 00:25:51,170 --> 00:25:55,350 Як замість того, щоб писати весь новий селектор і зміни його там, 617 00:25:55,350 --> 00:25:58,592 Ви можете просто об'єднати їх там, де він перекриває. 618 00:25:58,592 --> 00:26:00,670 >> ТОМАС Реймерс: Або ви могли б знайти out-- іноді 619 00:26:00,670 --> 00:26:04,290 є один клас, який робить колір шрифту, як синій, 620 00:26:04,290 --> 00:26:06,740 і є ще один клас, який робить синій фон. 621 00:26:06,740 --> 00:26:07,840 І це просто не буде працювати. 622 00:26:07,840 --> 00:26:10,924 Таким чином, ви написати спеціальний випадок, де, like-- але якщо він має і те, що ви 623 00:26:10,924 --> 00:26:13,548 збираюся зробити, це ви збираєтеся зробити це один цей відтінок синього 624 00:26:13,548 --> 00:26:15,310 і це одна ця інша відтінок синього. 625 00:26:15,310 --> 00:26:15,580 Вірно? 626 00:26:15,580 --> 00:26:17,955 >> Аллісон Бухгольц-AU: Добре для тих видів винятків. 627 00:26:17,955 --> 00:26:21,220 ТОМАС Реймерс: Так думати про проблеми 628 00:26:21,220 --> 00:26:25,000 які можуть виникнути, коли ви поєднуєте їх. 629 00:26:25,000 --> 00:26:27,020 Круто. 630 00:26:27,020 --> 00:26:29,692 Отже, повернемося до нашої презентації. 631 00:26:29,692 --> 00:26:31,400 Аллісон Бухгольц-AU: Ми вже майже там. 632 00:26:31,400 --> 00:26:34,022 ТОМАС Реймерс: І це припинив підключення. 633 00:26:34,022 --> 00:26:36,494 Аллісон Бухгольц-AU: О, ні. 634 00:26:36,494 --> 00:26:39,125 Аллісон Бухгольц-AU: CS на Office, Internet йде вниз. 635 00:26:39,125 --> 00:26:40,360 О, іронія. 636 00:26:40,360 --> 00:26:45,620 >> ТОМАС Реймерс: Так щастя, ми можемо уявити без інтернету, я думаю ,, 637 00:26:45,620 --> 00:26:47,380 тому що у нас все слайди тут. 638 00:26:47,380 --> 00:26:49,304 Отже, давайте поговоримо про Відносини тегів. 639 00:26:49,304 --> 00:26:50,470 Аллісон Бухгольц-AU: Вірно. 640 00:26:50,470 --> 00:26:52,660 Так просто якась йти від того, що сказав Томас, 641 00:26:52,660 --> 00:26:54,180 це просто ще один спосіб зробити це. 642 00:26:54,180 --> 00:26:57,840 Отже, ми маємо деякий батьків селектору з селектором дітей. 643 00:26:57,840 --> 00:27:02,815 Таким чином, в цьому прикладі тут, у нас є деякі корпус з класом навігаційної панелі, кнопок класу. 644 00:27:02,815 --> 00:27:03,315 Ах. 645 00:27:03,315 --> 00:27:03,990 >> ТОМАС Реймерс: О, вибачте. 646 00:27:03,990 --> 00:27:06,180 >> Аллісон Бухгольц-AU: І в основному, те, що це означає, 647 00:27:06,180 --> 00:27:11,070 це вибрати всі діти, як всі ці види селекторів, 648 00:27:11,070 --> 00:27:13,040 в цьому батьківського селектора. 649 00:27:13,040 --> 00:27:16,004 І це тільки ті, це коли-небудь, щоб звернутися. 650 00:27:16,004 --> 00:27:17,755 Я не знаю, якщо ви є кращий спосіб of-- 651 00:27:17,755 --> 00:27:19,504 ТОМАС Реймерс: Так що я думаю, як думати 652 00:27:19,504 --> 00:27:22,440 про це пам'ятати перш, як ми ніби як поставити їх разом. 653 00:27:22,440 --> 00:27:26,340 І тоді це означає, що один елемент який відповідає всім цим. 654 00:27:26,340 --> 00:27:29,530 Про що це говорить, я хочу, щоб ви відповідати всі 655 00:27:29,530 --> 00:27:33,220 в some-- Я хочу Вам знайти перемикач. 656 00:27:33,220 --> 00:27:35,670 І потім протягом, я хочу вам відповідати нові речі. 657 00:27:35,670 --> 00:27:36,170 Вірно? 658 00:27:36,170 --> 00:27:40,900 Таким чином, в CSS, це все про свого роду будучи в змозі відповідати ці предмети. 659 00:27:40,900 --> 00:27:43,050 І ви можете спробувати, щоб відповідати елементи в інші предмети. 660 00:27:43,050 --> 00:27:46,510 >> Отже, давайте насправді приклад, і ми думаємо, що буде уточнити. 661 00:27:46,510 --> 00:27:53,090 Отже, давайте уявимо, що у нас є спеціальна, Спеціальний досить, що завгодно. 662 00:27:53,090 --> 00:27:55,690 І тоді ми маємо посилання, добре? 663 00:27:55,690 --> 00:27:59,780 664 00:27:59,780 --> 00:28:02,370 Так що пам'ятайте, це посилання. 665 00:28:02,370 --> 00:28:03,900 Це не збирається нікуди йти. 666 00:28:03,900 --> 00:28:11,500 І ми збираємося дати йому посилання клас, я думаю. 667 00:28:11,500 --> 00:28:13,335 Давайте його на class-- дати мені ідею. 668 00:28:13,335 --> 00:28:14,460 Аллісон Бухгольц-AU: Круто. 669 00:28:14,460 --> 00:28:16,420 ТОМАС Реймерс: Coo-- давайте Їхати клас досить. 670 00:28:16,420 --> 00:28:16,930 Чому ні? 671 00:28:16,930 --> 00:28:17,971 >> Аллісон Бухгольц-AU: OK. 672 00:28:17,971 --> 00:28:23,040 ТОМАС Реймерс: Так Прямо зараз гарні речі 673 00:28:23,040 --> 00:28:26,000 збираємося зробити фон синій, колір фону лосося. 674 00:28:26,000 --> 00:28:27,969 Це має сенс. 675 00:28:27,969 --> 00:28:28,760 І якщо ми робимо this-- 676 00:28:28,760 --> 00:28:29,620 >> Аллісон Бухгольц-AU: Ви хочете, щоб додати текст 677 00:28:29,620 --> 00:28:31,078 так гіперпосилання насправді з'являється? 678 00:28:31,078 --> 00:28:35,088 ТОМАС Реймерс: Це буде хороший виклик. 679 00:28:35,088 --> 00:28:37,921 Аллісон Бухгольц-AU: Тому що право Тепер ми просто збираємося нічого не отримаєте. 680 00:28:37,921 --> 00:28:39,690 ТОМАС Реймерс: Так що це посилання. 681 00:28:39,690 --> 00:28:42,202 "Ця ланка." 682 00:28:42,202 --> 00:28:45,820 Так, і це буде щоб бути ще одна ланка. 683 00:28:45,820 --> 00:28:47,280 Давайте дамо йому клас "круто". 684 00:28:47,280 --> 00:28:50,295 Ви праві. 685 00:28:50,295 --> 00:28:50,795 Круто. 686 00:28:50,795 --> 00:28:53,590 687 00:28:53,590 --> 00:28:56,010 Так що зараз ми збираємося, щоб захопити це. 688 00:28:56,010 --> 00:28:57,269 Ми збираємося кинути один. 689 00:28:57,269 --> 00:28:59,060 У нас є один в спеціальний тег, і ми також 690 00:28:59,060 --> 00:29:01,150 будуть мати один в досить тега. 691 00:29:01,150 --> 00:29:05,449 І зараз те, що ми збираємося зробити це, ми збираємося зробити cool-- 692 00:29:05,449 --> 00:29:06,490 що ми хочемо це робити? 693 00:29:06,490 --> 00:29:10,347 694 00:29:10,347 --> 00:29:12,180 Аллісон Бухгольц-AU: Чи можемо ми зробити його більше? 695 00:29:12,180 --> 00:29:13,800 ТОМАС Реймерс: Давайте дамо йому кордону. 696 00:29:13,800 --> 00:29:14,840 Аллісон Бухгольц-AU: Ми могли б кордону. 697 00:29:14,840 --> 00:29:15,673 ТОМАС Реймерс: Так. 698 00:29:15,673 --> 00:29:18,560 Так що ми збираємося зробити щось як, кордон is-- і ми 699 00:29:18,560 --> 00:29:20,971 збираюся пояснити все це в одну секунду. 700 00:29:20,971 --> 00:29:21,470 На даний момент-- 701 00:29:21,470 --> 00:29:24,592 >> Аллісон Бухгольц-AU: Для моделі коробки. 702 00:29:24,592 --> 00:29:27,300 ТОМАС Реймерс: Але зараз ми знаходимося просто хочу, щоб дати йому кордону. 703 00:29:27,300 --> 00:29:29,580 Так що це означає, що ви побачите ці посилання. 704 00:29:29,580 --> 00:29:32,788 І ви побачите, що вони мають Вони, як і потворні чорні смуги, які 705 00:29:32,788 --> 00:29:33,820 це круто. 706 00:29:33,820 --> 00:29:34,500 >> Аллісон Бухгольц-AU: Наш сайт так досить. 707 00:29:34,500 --> 00:29:35,333 >> ТОМАС Реймерс: Так. 708 00:29:35,333 --> 00:29:38,930 Наш сайт є дивним. 709 00:29:38,930 --> 00:29:41,585 Таким чином, ці два посилання, і вони з'являться. 710 00:29:41,585 --> 00:29:44,160 Тепер давайте уявимо, що я тільки хотів це зробити 711 00:29:44,160 --> 00:29:50,072 якщо він не був у той який мав фон лосося. 712 00:29:50,072 --> 00:29:52,280 Так що пам'ятайте, що цей має досвід лосося, 713 00:29:52,280 --> 00:29:54,000 тому що це класу досить. 714 00:29:54,000 --> 00:29:59,777 >> Але ми хочемо сказати, що тільки охолоджує які знаходяться в класі спеціального, а не в класі 715 00:29:59,777 --> 00:30:02,890 красива, повинен мати цю межу. 716 00:30:02,890 --> 00:30:12,549 Ну, те, що ви можете зробити, це ви можу сказати .special, простір, .cool. 717 00:30:12,549 --> 00:30:15,590 І на що це робить, коли ви думаєте, про це, це в основному говорять, 718 00:30:15,590 --> 00:30:19,530 Добре, знайди мені все що відповідає особливим. 719 00:30:19,530 --> 00:30:24,104 Потім протягом цих тегів, знайти мені все це здорово. 720 00:30:24,104 --> 00:30:27,270 Аллісон Бухгольц-AU: Так що інший спосіб що може бути добре думати про це, 721 00:30:27,270 --> 00:30:29,810 повернути його до С, так само, як ідеї області. 722 00:30:29,810 --> 00:30:34,020 Тому, коли у вас є деякі Селектор, як ті, 723 00:30:34,020 --> 00:30:38,460 що ми працюємо для до цього, вся ваша веб-сторінка, і всі ваші HTML 724 00:30:38,460 --> 00:30:40,180 знаходиться в межах вашої видимості, чи не так? 725 00:30:40,180 --> 00:30:43,090 Але коли у нас є ці батько-нащадок, 726 00:30:43,090 --> 00:30:47,130 це як якби ви звуження, де Ви хочете в певному місці, 727 00:30:47,130 --> 00:30:50,540 як якби, як ми дивимося в специфічна функція, а 728 00:30:50,540 --> 00:30:52,007 всій нашій файлу. 729 00:30:52,007 --> 00:30:55,090 АУДИТОРІЯ: Так що з урахуванням цього, буде це мало значення, якби ми changed-- 730 00:30:55,090 --> 00:30:56,423 Аллісон Бухгольц-AU: порядок? 731 00:30:56,423 --> 00:30:59,320 АУДИТОРІЯ: --Обслужіваніе клас в CSS в .cool, простір, .special? 732 00:30:59,320 --> 00:31:01,153 Аллісон Бухгольц-AU: Та тому, що тоді 733 00:31:01,153 --> 00:31:04,420 хотів би сказати, сфера його все, що має прохолодний, 734 00:31:04,420 --> 00:31:07,235 а потім подивитися на те, has-- Я маю на увазі, як в даному випадку, 735 00:31:07,235 --> 00:31:08,860 Я не думаю, що це змінило б його. 736 00:31:08,860 --> 00:31:10,318 >> ТОМАС Реймерс: Якщо ми сказали, що? 737 00:31:10,318 --> 00:31:10,906 Вибачте. 738 00:31:10,906 --> 00:31:12,660 >> Аллісон Бухгольц-AU: Якщо ми Сфера йому охолонути, а потім 739 00:31:12,660 --> 00:31:14,550 дивитися на речі із спеціального, було б те ж саме, насправді. 740 00:31:14,550 --> 00:31:16,260 >> ТОМАС Реймерс: Тому він не буде. 741 00:31:16,260 --> 00:31:16,590 >> Аллісон Бухгольц-AU: Це не буде? 742 00:31:16,590 --> 00:31:17,590 О, да ладно. 743 00:31:17,590 --> 00:31:18,090 Я помиляюся. 744 00:31:18,090 --> 00:31:21,480 >> ТОМАС Реймерс: Так причина це different-- загального mistake-- 745 00:31:21,480 --> 00:31:27,140 це те, що зараз тільки посилання прохолодним, чи не так? 746 00:31:27,140 --> 00:31:32,176 Я думаю, моє питання до вас, хлопці, є, що на цій сторінці буде супроводжуватися .cool? 747 00:31:32,176 --> 00:31:35,984 748 00:31:35,984 --> 00:31:38,340 Є два тега тут, чи не так? 749 00:31:38,340 --> 00:31:39,770 Що це одне і це одне. 750 00:31:39,770 --> 00:31:40,590 І матч прохолодно. 751 00:31:40,590 --> 00:31:42,200 Ніщо інше не робить. 752 00:31:42,200 --> 00:31:46,460 Так що, якщо ви сказали, .cool, простір, .special, що ви збираєтеся сказати, це 753 00:31:46,460 --> 00:31:48,824 в цих тегах, що особливого? 754 00:31:48,824 --> 00:31:49,865 Аллісон Бухгольц-AU: Хм. 755 00:31:49,865 --> 00:31:51,800 Ось що it-- право. 756 00:31:51,800 --> 00:31:52,310 Бо це, як тільки щось тут. 757 00:31:52,310 --> 00:31:53,310 >> ТОМАС Реймерс: Так що не вибере нічого. 758 00:31:53,310 --> 00:31:56,530 >> Аллісон Бухгольц-AU: У той час як з спеціальна, ми в цих тегах тут. 759 00:31:56,530 --> 00:31:57,971 >> ТОМАС Реймерс: ті й ті. 760 00:31:57,971 --> 00:31:58,512 АУДИТОРІЯ: OK. 761 00:31:58,512 --> 00:31:58,920 Так що ті теги з коса риса? 762 00:31:58,920 --> 00:31:59,740 >> ТОМАС Реймерс: Так. 763 00:31:59,740 --> 00:32:01,150 Чи має це сенс? 764 00:32:01,150 --> 00:32:03,685 Як це в основному намагаються звузити сферу застосування. 765 00:32:03,685 --> 00:32:04,810 Аллісон Бухгольц-AU: Так. 766 00:32:04,810 --> 00:32:06,870 Я думаю, що це, ймовірно, Найпростіший спосіб думати про це. 767 00:32:06,870 --> 00:32:09,270 >> ТОМАС Реймерс: Таким чином ми знайшли це, і Ми знайшли цей збіглися особливим. 768 00:32:09,270 --> 00:32:11,400 А потім ми просимо, в рамках ці хлопці, що це круто? 769 00:32:11,400 --> 00:32:12,941 І в цей, цей круто. 770 00:32:12,941 --> 00:32:14,500 У цьому, нічого не круто. 771 00:32:14,500 --> 00:32:16,250 Так що це тільки ознака, яка залишається. 772 00:32:16,250 --> 00:32:20,112 >> Аллісон Бухгольц-AU: У той час як круто тільки в цих биркою там. 773 00:32:20,112 --> 00:32:21,070 ТОМАС Реймерс: Абсолютно вірно. 774 00:32:21,070 --> 00:32:22,403 І те, що особливого в них? 775 00:32:22,403 --> 00:32:22,930 Нічого. 776 00:32:22,930 --> 00:32:25,270 Тепер те, що я скажу, Якщо немає місця, 777 00:32:25,270 --> 00:32:29,880 Ви питаєте, що це круто і special-- або те, що досить і спеціальні, чи не так? 778 00:32:29,880 --> 00:32:35,370 Якщо ви говорите, .special.pretty, що це так само, як .pretty.special. 779 00:32:35,370 --> 00:32:39,220 >> Тому що те, що видалення простір питаю, коли ви говорите, .special, 780 00:32:39,220 --> 00:32:40,970 Ви запитуєте, добре, ті, які є особливими? 781 00:32:40,970 --> 00:32:43,780 І тоді ті, які з них також досить, 782 00:32:43,780 --> 00:32:47,010 що ж, граматично, що запитати, що це досить, 783 00:32:47,010 --> 00:32:49,500 а потім з них, що також особливого? 784 00:32:49,500 --> 00:32:50,000 Вірно? 785 00:32:50,000 --> 00:32:53,099 Ця відмінність що в якісь є. 786 00:32:53,099 --> 00:32:53,640 АУДИТОРІЯ: OK. 787 00:32:53,640 --> 00:32:54,473 ТОМАС Реймерс: Так. 788 00:32:54,473 --> 00:32:56,670 789 00:32:56,670 --> 00:32:58,030 Високий. 790 00:32:58,030 --> 00:33:00,426 Так що з вигляду then-- 791 00:33:00,426 --> 00:33:01,800 >> Аллісон Бухгольц-AU: Я думаю, що наша остання Справа в тому, (в маскарадних британським акцентом) 792 00:33:01,800 --> 00:33:02,510 Модель вікно. 793 00:33:02,510 --> 00:33:05,992 >> ТОМАС Реймерс: box-- [хихикає] Мені подобається, як Еллісон каже, що. 794 00:33:05,992 --> 00:33:06,950 Так блокову модель речі. 795 00:33:06,950 --> 00:33:09,644 >> Аллісон Бухгольц-AU: Просто коробка, я буду ваша модель вікно. 796 00:33:09,644 --> 00:33:11,310 ТОМАС Реймерс: Отже, давайте поговоримо про це. 797 00:33:11,310 --> 00:33:14,070 Так що зараз ми витратили багато часу на розмови про селекторів. 798 00:33:14,070 --> 00:33:16,944 В даний час, ви, хлопці, напевно, як, майстри selectors-- ви знаєте, 799 00:33:16,944 --> 00:33:21,510 Як точно вибрати контент, який Ви хочете, щоб маніпулювати на екрані. 800 00:33:21,510 --> 00:33:24,740 >> Так що тепер питання в тому, як саме ви можете працювати з ним? 801 00:33:24,740 --> 00:33:27,010 Так що я думаю, саме основне спосіб думати про те, що 802 00:33:27,010 --> 00:33:30,294 , Ну, що саме є елементом CSS? 803 00:33:30,294 --> 00:33:32,585 Ми витратили багато часу кажу, що тег, 804 00:33:32,585 --> 00:33:36,140 або, що те саме основне уявлення тега? 805 00:33:36,140 --> 00:33:39,870 806 00:33:39,870 --> 00:33:45,170 >> Хороший спосіб думати про тобто, що форма лосося? 807 00:33:45,170 --> 00:33:47,295 Яку форму, начебто, оранжево-рожевий фон? 808 00:33:47,295 --> 00:33:47,880 >> АУДИТОРІЯ: Це прямокутник. 809 00:33:47,880 --> 00:33:49,040 >> ТОМАС Реймерс: Це прямокутник, вірно? 810 00:33:49,040 --> 00:33:50,956 >> Аллісон Бухгольц-AU: Був не питання з підступом. 811 00:33:50,956 --> 00:33:51,870 [Сміх] 812 00:33:51,870 --> 00:33:54,670 >> ТОМАС Реймерс: Не намагаючись щоб обдурити вас, хлопці так пізно. 813 00:33:54,670 --> 00:33:57,510 Отже, ми маємо цей прямокутник. 814 00:33:57,510 --> 00:33:59,140 І тег р, чи не так? 815 00:33:59,140 --> 00:34:02,280 Так що дає нам хороший переконання, що пункт 816 00:34:02,280 --> 00:34:07,440 представляється у вигляді прямокутника, в Принаймні, у свідомості браузер, який 817 00:34:07,440 --> 00:34:08,715 це. 818 00:34:08,715 --> 00:34:11,423 >> Аллісон Бухгольц-AU: Я маю на увазі, браузери зазвичай мають прямокутний, 819 00:34:11,423 --> 00:34:13,440 так що має сенс. 820 00:34:13,440 --> 00:34:18,750 >> ТОМАС Реймерс: ідея тут що всі теги всередині CSS 821 00:34:18,750 --> 00:34:21,790 представлені у вигляді прямокутника. 822 00:34:21,790 --> 00:34:25,699 І кожен прямокутник має чотири частин відповідно до CSS, ОК? 823 00:34:25,699 --> 00:34:27,830 У вас є фактичний зміст. 824 00:34:27,830 --> 00:34:29,644 Ось де текст лежить. 825 00:34:29,644 --> 00:34:30,470 >> Аллісон Бухгольц-AU: Може бути, ваша картина. 826 00:34:30,470 --> 00:34:31,303 >> ТОМАС Реймерс: Так. 827 00:34:31,303 --> 00:34:33,860 Ви повинні відступи, який є просто якийсь пробіл. 828 00:34:33,860 --> 00:34:35,085 Тоді у вас є кордону. 829 00:34:35,085 --> 00:34:37,710 І тоді у вас є запас, який це білий простір за межами цього. 830 00:34:37,710 --> 00:34:39,460 Так що немає сенсу для всіх, тому ми 831 00:34:39,460 --> 00:34:42,500 будемо говорити про те, що ні на секунду. 832 00:34:42,500 --> 00:34:47,570 Так прямо тут, що ми збираємося робити що ми збираємося створити деякі діви, добре? 833 00:34:47,570 --> 00:34:48,420 Вибачте мене, поки я-- 834 00:34:48,420 --> 00:34:51,506 >> Аллісон Бухгольц-AU: Я відчуваю, як ми повинні поставити милий знімок в. 835 00:34:51,506 --> 00:34:52,520 >> ТОМАС Реймерс: Ми, безумовно, повинно бути. 836 00:34:52,520 --> 00:34:53,389 >> Аллісон Бухгольц-AU: Я відчуваю, як все 837 00:34:53,389 --> 00:34:54,870 могли б виграти від милий картина, от і все. 838 00:34:54,870 --> 00:34:56,774 >> ТОМАС Реймерс: Чи можемо ми всі вигоди від a-- 839 00:34:56,774 --> 00:34:57,648 >> АУДИТОРІЯ: Так, звичайно. 840 00:34:57,648 --> 00:34:58,790 ТОМАС Реймерс: Добре, круто. 841 00:34:58,790 --> 00:35:02,254 Таким чином, ми повинні покласти мило картинка в десь. 842 00:35:02,254 --> 00:35:05,295 Аллісон Бухгольц-AU: Я відчуваю, як милий зайчик може бути корисно просто зараз. 843 00:35:05,295 --> 00:35:06,190 ТОМАС Реймерс: Звичайно. 844 00:35:06,190 --> 00:35:06,950 Аллісон Бухгольц-AU: Кінець тижня. 845 00:35:06,950 --> 00:35:07,390 Є що adorab-- 846 00:35:07,390 --> 00:35:08,520 >> ТОМАС Реймерс: Як щодо кошеня? 847 00:35:08,520 --> 00:35:09,220 >> Аллісон Бухгольц-AU: Кошеня працює, теж. 848 00:35:09,220 --> 00:35:11,300 >> ТОМАС Реймерс: Круто, тому що є місце для цього. 849 00:35:11,300 --> 00:35:12,300 Це називається PlaceKitten. 850 00:35:12,300 --> 00:35:14,719 Аллісон Бухгольц-AU: Це здорово. 851 00:35:14,719 --> 00:35:15,510 ТОМАС Реймерс: Так. 852 00:35:15,510 --> 00:35:18,040 Аллісон Бухгольц-AU: Просто для, як, заповнювачі зображення на веб-сайт. 853 00:35:18,040 --> 00:35:18,914 ТОМАС Реймерс: Мм-ом. 854 00:35:18,914 --> 00:35:21,520 Там також PlacePuppy. 855 00:35:21,520 --> 00:35:22,832 І є PlaceBacon. 856 00:35:22,832 --> 00:35:24,340 >> Аллісон Бухгольц-AU: PlaceBacon? 857 00:35:24,340 --> 00:35:25,350 Справді? 858 00:35:25,350 --> 00:35:28,190 >> ТОМАС Реймерс: О, ми не є доступ в Інтернет тут. 859 00:35:28,190 --> 00:35:29,875 >> Аллісон Бухгольц-AU: [Стогін] 860 00:35:29,875 --> 00:35:30,375 Трагічна. 861 00:35:30,375 --> 00:35:32,333 ТОМАС Реймерс: В іншому випадку, Я б показати вам, хлопці, 862 00:35:32,333 --> 00:35:33,870 Як помістити зображення на вашому сайті. 863 00:35:33,870 --> 00:35:36,370 Ми збираємося, щоб спробувати отримати це роботу перш ніж ми повинні йти. 864 00:35:36,370 --> 00:35:38,660 Але зараз, ми просто будемо говорити в кольорах, то. 865 00:35:38,660 --> 00:35:39,820 Ми хочемо покласти фотографії kittens-- 866 00:35:39,820 --> 00:35:40,210 >> Аллісон Бухгольц-AU: Ми зробили. 867 00:35:40,210 --> 00:35:43,110 >> ТОМАС Реймерс: --Обслужіваніе Інтернету вниз на даний момент буття. 868 00:35:43,110 --> 00:35:47,820 Отже, ми маємо дві діви, і ми збираюся дати їм два ідентифікаторів. 869 00:35:47,820 --> 00:35:51,380 870 00:35:51,380 --> 00:35:56,760 Ми збираємося називати його "Перший" та "другої". 871 00:35:56,760 --> 00:36:01,184 Так ID = "перший". 872 00:36:01,184 --> 00:36:02,850 І ми збираємося, щоб дати їм два кольори. 873 00:36:02,850 --> 00:36:08,424 Так як ми вибираємо щось з ідентифікатором "перший"? 874 00:36:08,424 --> 00:36:09,840 Аллісон Бухгольц-AU: Dot або хеш? 875 00:36:09,840 --> 00:36:10,730 АУДИТОРІЯ: Sharp. 876 00:36:10,730 --> 00:36:12,940 ТОМАС Реймерс: Sharp, ідеально. 877 00:36:12,940 --> 00:36:14,950 Sharp, хеш, незалежно we-- 878 00:36:14,950 --> 00:36:15,680 >> Аллісон Бухгольц-AU: Багато речей, щоб назвати його. 879 00:36:15,680 --> 00:36:16,430 >> ТОМАС Реймерс: OK. 880 00:36:16,430 --> 00:36:19,800 Ми збираємося селитися на хештегом, і це те, що ми збираємося піти с. 881 00:36:19,800 --> 00:36:20,300 ОК? 882 00:36:20,300 --> 00:36:20,735 >> Аллісон Бухгольц-AU: хештегом. 883 00:36:20,735 --> 00:36:22,340 >> ТОМАС Реймерс: Так хештег в першу чергу. 884 00:36:22,340 --> 00:36:24,506 >> Аллісон Бухгольц-AU: Так Ви можете чірікать seminar-- 885 00:36:24,506 --> 00:36:27,582 хештегом CSS, хештег прохолодно. 886 00:36:27,582 --> 00:36:29,040 ТОМАС Реймерс: хештегом Awesomeness. 887 00:36:29,040 --> 00:36:30,730 Аллісон Бухгольц-AU: Хештегом Awesomeness, так. 888 00:36:30,730 --> 00:36:31,480 ТОМАС Реймерс: OK. 889 00:36:31,480 --> 00:36:33,660 Отже, ми маємо "перший" і "друга". 890 00:36:33,660 --> 00:36:37,697 Отже, спочатку ми матимемо Колір фону в червоний колір. 891 00:36:37,697 --> 00:36:39,030 Аллісон Бухгольц-AU: Ну, товстої кишки. 892 00:36:39,030 --> 00:36:40,281 ТОМАС Реймерс: Так. 893 00:36:40,281 --> 00:36:42,281 Аллісон Бухгольц-AU: Я буду твоїм спот-перевірки. 894 00:36:42,281 --> 00:36:43,960 ТОМАС Реймерс: Allison отримав мене. 895 00:36:43,960 --> 00:36:45,830 Фон-колір blue-- 896 00:36:45,830 --> 00:36:46,810 >> ТОМАС Реймерс: Фіолетовий! 897 00:36:46,810 --> 00:36:47,726 >> ТОМАС Реймерс: Фіолетовий. 898 00:36:47,726 --> 00:36:48,830 Аллісон Бухгольц-AU: Так. 899 00:36:48,830 --> 00:36:50,630 Purple мій улюблений колір, і ми не використали його ще. 900 00:36:50,630 --> 00:36:51,546 >> ТОМАС Реймерс: Вайолет. 901 00:36:51,546 --> 00:36:53,361 Аллісон Бухгольц-AU: Вайолет. 902 00:36:53,361 --> 00:36:53,860 Це працює. 903 00:36:53,860 --> 00:36:56,482 904 00:36:56,482 --> 00:36:59,880 >> ТОМАС Реймерс: Так що ми матиме два діви. 905 00:36:59,880 --> 00:37:01,654 Вони збираються, щоб бути повністю порожнім. 906 00:37:01,654 --> 00:37:03,070 Ми повинні, ймовірно, якийсь текст. 907 00:37:03,070 --> 00:37:05,580 908 00:37:05,580 --> 00:37:09,815 Таким чином, "Перший" буде "привіт". 909 00:37:09,815 --> 00:37:10,940 І "другий" буде say-- 910 00:37:10,940 --> 00:37:11,110 >> Аллісон Бухгольц-AU: До побачення. 911 00:37:11,110 --> 00:37:12,514 >> АУДИТОРІЯ: - "мир". 912 00:37:12,514 --> 00:37:14,122 Здрастуйте, до побачення. 913 00:37:14,122 --> 00:37:16,580 Аллісон Бухгольц-AU: я бачив їх у концерті на два тижні. 914 00:37:16,580 --> 00:37:17,705 ТОМАС Реймерс: The Beatles? 915 00:37:17,705 --> 00:37:20,242 Аллісон Бухгольц-AU: Для чисел. 916 00:37:20,242 --> 00:37:21,200 Вони не так вже й велика. 917 00:37:21,200 --> 00:37:24,084 918 00:37:24,084 --> 00:37:24,750 Мені це не подобається. 919 00:37:24,750 --> 00:37:26,060 >> ТОМАС Реймерс: У нас є "HELLO" і "до побачення". 920 00:37:26,060 --> 00:37:29,102 І знову, CSS це просто приголомшливо, оскільки вона визнає наші кольори. 921 00:37:29,102 --> 00:37:30,810 Не потрібно навіть побоюються, що вони існують. 922 00:37:30,810 --> 00:37:33,194 Вони роблять. 923 00:37:33,194 --> 00:37:35,130 >> Аллісон Бухгольц-AU: вони існують. 924 00:37:35,130 --> 00:37:39,560 >> ТОМАС Реймерс: Так CSS Я думаю, має 255 слів, щоб говорити про колір. 925 00:37:39,560 --> 00:37:42,986 Якщо ви можете думати про колір поза ті 255, як я буду вражений. 926 00:37:42,986 --> 00:37:44,110 Аллісон Бухгольц-AU: Так. 927 00:37:44,110 --> 00:37:45,560 Я думаю, що ви, хлопці, може мати просто прийти в відразу після. 928 00:37:45,560 --> 00:37:47,727 >> ТОМАС Реймерс: Так от, Ви побачите у нас є дві коробки 929 00:37:47,727 --> 00:37:49,143 прямо на вершині один одного, чи не так? 930 00:37:49,143 --> 00:37:50,200 Здрастуй і прощай. 931 00:37:50,200 --> 00:37:51,460 >> Аллісон Бухгольц-AU: Там немає місця між ними. 932 00:37:51,460 --> 00:37:53,390 Вони просто smooshed Право на верхній частині один одного. 933 00:37:53,390 --> 00:37:55,973 >> ТОМАС Реймерс: Отже, перше, Я думаю, ми повинні говорити про 934 00:37:55,973 --> 00:38:02,960 є також давайте say-- так. 935 00:38:02,960 --> 00:38:08,020 Так CSS представляє їх як свого роду ящиків. 936 00:38:08,020 --> 00:38:10,100 І як коробки, вони мають зміст. 937 00:38:10,100 --> 00:38:14,540 І зміст прямо зараз є свого роду привіт або до побачення і ось воно. 938 00:38:14,540 --> 00:38:15,040 ОК? 939 00:38:15,040 --> 00:38:19,790 >> Таким чином, одна з перших речей, які ви можете зробити, це ви можете додати відступи. 940 00:38:19,790 --> 00:38:25,610 Заповнення говорить, як багато місця він повинен вийти на кожній стороні. 941 00:38:25,610 --> 00:38:29,200 Так що давайте говорити, що я хочу сказати, 10 пікселів з кожного боку. 942 00:38:29,200 --> 00:38:31,234 І я буду розсікати, що в секунду. 943 00:38:31,234 --> 00:38:33,150 Аллісон Бухгольц-AU: Всі ці речі тут 944 00:38:33,150 --> 00:38:36,980 збираються бути в основному в пікселях для іншої частини семінару. 945 00:38:36,980 --> 00:38:40,980 Ви будете бачити, що вона має деякий простір навколо нього, чи не так? 946 00:38:40,980 --> 00:38:46,360 Так що ви не бачите тут є ця невидима роду доповнення 947 00:38:46,360 --> 00:38:49,600 на кожній стороні, яка говорить, начебто, ОК, у вас є ящик content-- 948 00:38:49,600 --> 00:38:51,680 >> Аллісон Бухгольц-AU: Ви хочете просто підтягти інспектувати елемент? 949 00:38:51,680 --> 00:38:53,659 >> ТОМАС Реймерс: Так, це хороша ідея. 950 00:38:53,659 --> 00:38:56,700 Аллісон Бухгольц-AU: Крім того, я вважаю, що перевірити елемент хороший спосіб 951 00:38:56,700 --> 00:39:01,280 щоб з'ясувати, якщо щось відбувається неправильно, щось несподіване, 952 00:39:01,280 --> 00:39:04,570 оглядаючи теги і бачачи, що це як переписуються корисно. 953 00:39:04,570 --> 00:39:05,940 >> ТОМАС Реймерс: Так що я не впевнений, якщо ви, хлопці, можете побачити цей колір. 954 00:39:05,940 --> 00:39:06,470 Чи можете ви? 955 00:39:06,470 --> 00:39:10,120 Ви побачите це оббивка від виду кромки. 956 00:39:10,120 --> 00:39:13,410 І тоді ви побачите фактичне вміст у синій, чи не так? 957 00:39:13,410 --> 00:39:16,820 Так от дуже Основи блокової моделі. 958 00:39:16,820 --> 00:39:17,674 Ви повинні зміст. 959 00:39:17,674 --> 00:39:18,590 Тоді у вас є доповнення. 960 00:39:18,590 --> 00:39:20,440 >> Зал: А чому б тобі просто використовувати рамку в the-- 961 00:39:20,440 --> 00:39:21,606 >> Аллісон Бухгольц-AU: Вірно. 962 00:39:21,606 --> 00:39:24,745 Тому що це просто вибору елемент прямо зараз. 963 00:39:24,745 --> 00:39:26,050 >> ТОМАС Реймерс: Так. 964 00:39:26,050 --> 00:39:27,060 Інші речі. 965 00:39:27,060 --> 00:39:29,780 Отже, давайте поговоримо про те, що Команда оббивка на секунду. 966 00:39:29,780 --> 00:39:36,380 Таким чином, в CSS, вимірювання повинні мати пристрій. 967 00:39:36,380 --> 00:39:39,740 Тому спочатку потрібно суму. 968 00:39:39,740 --> 00:39:41,460 Таким чином, в цьому випадку, ми вже говорили 10. 969 00:39:41,460 --> 00:39:44,780 І тоді наступний ми вже говорили це піксель, пікс. 970 00:39:44,780 --> 00:39:49,160 Інші з них ви могли б мати є речі, як сантиметри, дюйми. 971 00:39:49,160 --> 00:39:51,367 Ви можете робити речі, як, що становить 10 дюймів? 972 00:39:51,367 --> 00:39:52,700 І це буде смішно. 973 00:39:52,700 --> 00:39:52,990 >> Аллісон Бухгольц-AU: О, хлопчик. 974 00:39:52,990 --> 00:39:53,460 >> АУДИТОРІЯ: Вау. 975 00:39:53,460 --> 00:39:54,460 >> ТОМАС і Еллісон: Так. 976 00:39:54,460 --> 00:39:57,840 ТОМАС Реймерс: Так от всі оббивка. 977 00:39:57,840 --> 00:39:59,255 Я збираюся повернутися до пікселів. 978 00:39:59,255 --> 00:40:01,754 >> Аллісон Бухгольц-AU: Пікселі як правило, бути, як, стандарту. 979 00:40:01,754 --> 00:40:04,589 Коли ви дивитеся на багато веб-сайтів, вони в основному працюють в пікселях. 980 00:40:04,589 --> 00:40:07,755 ТОМАС Реймерс: Так що ви збираєтеся, щоб побачити або pixels-- інші ті, які ви бачите 981 00:40:07,755 --> 00:40:13,952 це їх, який є одним ЕМ дорівнює висоті шрифту 982 00:40:13,952 --> 00:40:15,160 які ви використовуєте. 983 00:40:15,160 --> 00:40:16,201 >> Аллісон Бухгольц-AU: мм. 984 00:40:16,201 --> 00:40:17,574 985 00:40:17,574 --> 00:40:20,740 ТОМАС Реймерс: Це хороший спосіб сказати, як я хочу, стільки ж місця, як мій шрифт 986 00:40:20,740 --> 00:40:21,514 приймає. 987 00:40:21,514 --> 00:40:23,180 Аллісон Бухгольц-AU: Не знаю, що. 988 00:40:23,180 --> 00:40:25,747 Ви дізнаєтеся щось нове кожен день. 989 00:40:25,747 --> 00:40:27,955 ТОМАС Реймерс: Є багато вимірів в CS. 990 00:40:27,955 --> 00:40:29,260 Я пропоную вам подивитися їх. 991 00:40:29,260 --> 00:40:32,122 Для всіх ваших випадках, я думаю, пікселів має бути достатньо. 992 00:40:32,122 --> 00:40:33,830 І вони також, що Ви будете бачити 993 00:40:33,830 --> 00:40:36,520 У більшості прикладів зробити в режимі онлайн. 994 00:40:36,520 --> 00:40:38,320 Таким чином, ми залишити його в пікселях. 995 00:40:38,320 --> 00:40:42,420 >> Ви також можете, я повинен say-- так оббивка встановлює всі прокладок. 996 00:40:42,420 --> 00:40:49,789 Ви також можете зробити щось на зразок "Оббивка-топ" просто set-- 997 00:40:49,789 --> 00:40:52,080 Аллісон Бухгольц-AU: Може бути, ми отримаємо наш "привіт" назад. 998 00:40:52,080 --> 00:40:55,480 ТОМАС Реймерс: --to просто встановити оббивка зверху і нічого більше. 999 00:40:55,480 --> 00:40:59,560 Таким чином, чотири команди оббивка-топ, оббивка дном, оббивка-наліво, 1000 00:40:59,560 --> 00:41:00,310 і оббивка правом. 1001 00:41:00,310 --> 00:41:02,470 >> Аллісон Бухгольц-AU: Так само, як можна було б очікувати коробці. 1002 00:41:02,470 --> 00:41:03,530 >> ТОМАС Реймерс: Так. 1003 00:41:03,530 --> 00:41:05,240 Ніщо не надто божевільний там. 1004 00:41:05,240 --> 00:41:08,230 Чи має це сенс? 1005 00:41:08,230 --> 00:41:11,990 Так що це оббивка. 1006 00:41:11,990 --> 00:41:14,110 Я збираюся встановити всі в Прокладки повернутися до 10. 1007 00:41:14,110 --> 00:41:17,010 А потім я збираюся перейти на кордоні. 1008 00:41:17,010 --> 00:41:21,130 >> Так що кордон є межа це дивно команда. 1009 00:41:21,130 --> 00:41:24,450 Вона займає те три речі відразу. 1010 00:41:24,450 --> 00:41:28,930 Так-перше, це, як великий Ви хочу, щоб це було як вимір. 1011 00:41:28,930 --> 00:41:30,662 Знову ж таки, я тільки за допомогою пікселів. 1012 00:41:30,662 --> 00:41:32,620 І останнє, що я Слід додати, вимірам 1013 00:41:32,620 --> 00:41:35,270 це одна річ, яка не потрібен блок 0. 1014 00:41:35,270 --> 00:41:37,390 Це насправді невірно щоб дати 0 блок, 1015 00:41:37,390 --> 00:41:41,940 тому 0 0 по дюймів, пікселі, сантиметри, що завгодно. 1016 00:41:41,940 --> 00:41:43,960 Це всього лише означає, 0, чи не так? 1017 00:41:43,960 --> 00:41:46,710 Отже, спочатку ви даєте йому вимір. 1018 00:41:46,710 --> 00:41:48,650 >> Тоді ви даєте йому стиль. 1019 00:41:48,650 --> 00:41:49,869 Так що я збираюся сказати, "твердий". 1020 00:41:49,869 --> 00:41:51,410 І ми будемо говорити про те, що це означає. 1021 00:41:51,410 --> 00:41:54,290 І тоді, нарешті, ви даєте йому колір. 1022 00:41:54,290 --> 00:41:56,850 Так що я збираюся сказати "чорні". 1023 00:41:56,850 --> 00:41:59,637 І всі ці речі, які ми коли- Зараз бачив, за стилем, окрім, 1024 00:41:59,637 --> 00:42:00,720 але ми поговоримо про це. 1025 00:42:00,720 --> 00:42:04,120 Таким чином, ви, хлопці, бачили вимірювань, і ви бачили квітів. 1026 00:42:04,120 --> 00:42:10,410 І те, що відбувається, ми отримаємо це приємно чорна рамка навколо нього, чи не так? 1027 00:42:10,410 --> 00:42:11,620 Ви, хлопці, подивимося, як ми зробили це? 1028 00:42:11,620 --> 00:42:12,760 >> АУДИТОРІЯ: Так. 1029 00:42:12,760 --> 00:42:14,850 >> ТОМАС Реймерс: Круто. 1030 00:42:14,850 --> 00:42:17,370 Так що ж це? 1031 00:42:17,370 --> 00:42:19,160 Отже, перш за все, це один піксель. 1032 00:42:19,160 --> 00:42:20,880 Це самоочевидне достатньо, чи не так? 1033 00:42:20,880 --> 00:42:23,254 Мовляв, його товщина в один піксель. 1034 00:42:23,254 --> 00:42:26,170 Чи це буде один піксель, але я збільшено, так що це трохи більше 1035 00:42:26,170 --> 00:42:26,490 ніж це. 1036 00:42:26,490 --> 00:42:27,967 >> Аллісон Бухгольц-AU: І у нас є це смішно дозволом телевізора. 1037 00:42:27,967 --> 00:42:29,460 >> ТОМАС Реймерс: Так. 1038 00:42:29,460 --> 00:42:33,640 Ви можете зробити це більше, менше, що завгодно. 1039 00:42:33,640 --> 00:42:35,630 Так ось два пікселя кордону. 1040 00:42:35,630 --> 00:42:38,810 Ви побачите, що це в два рази товще. 1041 00:42:38,810 --> 00:42:40,172 Наступна річ, яку ви повинні колір. 1042 00:42:40,172 --> 00:42:41,130 Це не цікаво. 1043 00:42:41,130 --> 00:42:42,710 Я не збираюся говорити про те, що, насправді. 1044 00:42:42,710 --> 00:42:45,110 >> Аллісон Бухгольц-AU: Але стиль може бути тільки трохи цікавіше. 1045 00:42:45,110 --> 00:42:45,980 >> ТОМАС Реймерс: Так. 1046 00:42:45,980 --> 00:42:48,560 Так стилі, є небагато що я бачу звичайно використовується. 1047 00:42:48,560 --> 00:42:55,690 Спочатку один Твердий, поруч своїх пунктирна, а останній в виправдалися. 1048 00:42:55,690 --> 00:42:59,290 І тут всіяна. 1049 00:42:59,290 --> 00:43:02,980 Ви побачите, що вони купа точок, чи не так? 1050 00:43:02,980 --> 00:43:09,030 Хороший спосіб роду отримати хороший кордон відбувається, тире також досить популярні. 1051 00:43:09,030 --> 00:43:11,580 1052 00:43:11,580 --> 00:43:13,600 >> Аллісон Бухгольц-AU: І тоді, звичайно, я 1053 00:43:13,600 --> 00:43:16,660 впевнений, що є багато інших стилі, які ви можете отримати. 1054 00:43:16,660 --> 00:43:20,000 І у нас є великий набір посилання в кінці для вас, хлопці 1055 00:43:20,000 --> 00:43:23,470 до виду переглянути та подивитися на більш прохолодною CSS. 1056 00:43:23,470 --> 00:43:25,954 >> ТОМАС Реймерс: А потім І останнє, що ми 1057 00:43:25,954 --> 00:43:27,870 будемо говорити про Моделі коробка дійсно швидко. 1058 00:43:27,870 --> 00:43:30,070 Ну, а далі кордону, так само, як доповнення, 1059 00:43:30,070 --> 00:43:33,270 у вас також є речі, як межа зліва, межі прав, межі-топ, 1060 00:43:33,270 --> 00:43:37,590 кордони знизу, які дозволяють щоб дістатися до певного кордону. 1061 00:43:37,590 --> 00:43:40,650 Так от просто межа лівої визначені. 1062 00:43:40,650 --> 00:43:43,060 Чи означає це, має сенс? 1063 00:43:43,060 --> 00:43:46,170 >> Аллісон Бухгольц-AU: Це здорово спосіб підкреслити те, чи додати 1064 00:43:46,170 --> 00:43:47,545 Лінії між різними елементами. 1065 00:43:47,545 --> 00:43:48,670 ТОМАС Реймерс: Абсолютно вірно. 1066 00:43:48,670 --> 00:43:50,940 Так от наш кордон. 1067 00:43:50,940 --> 00:43:52,790 І останнє в запас. 1068 00:43:52,790 --> 00:43:55,892 Як оббивка маржа в Крім це не within-- 1069 00:43:55,892 --> 00:43:57,975 Аллісон Бухгольц-AU: Це не навколо елемента 1070 00:43:57,975 --> 00:44:00,840 але насправді по всій вікно, в якому ми були бачити. 1071 00:44:00,840 --> 00:44:02,770 >> ТОМАС Реймерс: Так. 1072 00:44:02,770 --> 00:44:04,090 Еллісон сказав, що це прекрасно. 1073 00:44:04,090 --> 00:44:07,550 Це не так, як, у Ваших Елемент, це навколо всієї коробки. 1074 00:44:07,550 --> 00:44:10,900 Це означає, що такі речі, як фон не застосовувати до нього. 1075 00:44:10,900 --> 00:44:13,550 І це в основному говорить, як я нічого не хочу 1076 00:44:13,550 --> 00:44:15,230 в цьому багато місця для мене. 1077 00:44:15,230 --> 00:44:17,470 Так як тут ми маємо маржа 10 пікселів. 1078 00:44:17,470 --> 00:44:23,100 Так що нічого протягом 10 пікселів повинні бути поруч зі мною. 1079 00:44:23,100 --> 00:44:26,210 Щось на зразок його простором, але вигляд не так. 1080 00:44:26,210 --> 00:44:29,215 Так от дуже Основи блокової моделі. 1081 00:44:29,215 --> 00:44:30,090 Чи має це сенс? 1082 00:44:30,090 --> 00:44:33,830 1083 00:44:33,830 --> 00:44:34,550 Круто, круто. 1084 00:44:34,550 --> 00:44:35,800 Аллісон Бухгольц-AU: Awesome. 1085 00:44:35,800 --> 00:44:37,890 Так що тепер я думаю, що ми просто наші класні ресурси 1086 00:44:37,890 --> 00:44:41,220 що ми будемо приймати вас, хлопці через дуже швидко. 1087 00:44:41,220 --> 00:44:44,815 І ми будемо actually-- добре, у нас є Інтернет ще? 1088 00:44:44,815 --> 00:44:47,860 >> ТОМАС Реймерс: Давайте побачити, якщо я можу відкрити up-- 1089 00:44:47,860 --> 00:44:50,040 дозвольте мені побачити, якщо я може отримати доступ в Інтернет швидко 1090 00:44:50,040 --> 00:44:53,317 в той час як Еллісон говорить ні про що Еллісон хоче говорити про це. 1091 00:44:53,317 --> 00:44:55,150 Аллісон Бухгольц-AU: Так basically-- я не 1092 00:44:55,150 --> 00:44:57,930 знаю, що ще я можу сказати на даний момент. 1093 00:44:57,930 --> 00:45:01,340 Але ось деякі дійсно хороші ресурси. 1094 00:45:01,340 --> 00:45:04,629 Це ті, які Томас і я використав 1095 00:45:04,629 --> 00:45:06,420 і що ми насправді використовується в підготовчу для цього. 1096 00:45:06,420 --> 00:45:09,940 W3Schools це той, який вам Хлопці повинні були бачити раніше. 1097 00:45:09,940 --> 00:45:12,440 Ми рекомендуємо його для багато речей, за допомогою CSS. 1098 00:45:12,440 --> 00:45:15,060 Я знаю, я рекомендую його мій розділ весь час. 1099 00:45:15,060 --> 00:45:21,050 >> Один з найбільших речей в тому, що його дозволяє роду возитися з CSS 1100 00:45:21,050 --> 00:45:23,830 і побачити зміни миттєво в цьому, 1101 00:45:23,830 --> 00:45:25,920 як, Дивившися Двомісний вікна, що він має. 1102 00:45:25,920 --> 00:45:29,980 Таким чином, ви не повинні турбуватися про створення власного веб-сторінку, 1103 00:45:29,980 --> 00:45:33,090 або створення віртуальний хост у вашому локальному пристрої і локальний хост, 1104 00:45:33,090 --> 00:45:34,980 і отримувати все, що речі працювати. 1105 00:45:34,980 --> 00:45:36,830 Вони вбудовані прямо на сторінці. 1106 00:45:36,830 --> 00:45:39,042 >> І вона має таких мало уроки, які ви можете 1107 00:45:39,042 --> 00:45:40,750 пройти, щоб дізнатися Детальніше про селекторів, 1108 00:45:40,750 --> 00:45:44,610 або дізнатися про маніпулювання шрифту або фону, або зображення. 1109 00:45:44,610 --> 00:45:46,990 І у вас є ці миттєві результати, які ви 1110 00:45:46,990 --> 00:45:49,310 не потрібно робити нічого Інша підготовчу роботу для. 1111 00:45:49,310 --> 00:45:51,060 Так що я люблю W3Schools. 1112 00:45:51,060 --> 00:45:51,960 Це неймовірно. 1113 00:45:51,960 --> 00:45:52,670 Хіба це працює? 1114 00:45:52,670 --> 00:45:52,950 >> ТОМАС Реймерс: Так. 1115 00:45:52,950 --> 00:45:53,720 Ні, це не так. 1116 00:45:53,720 --> 00:45:55,636 Хочете, щоб я спробував і перезавантажити комп'ютер? 1117 00:45:55,636 --> 00:45:56,410 Чи ми хочемо to-- 1118 00:45:56,410 --> 00:46:01,490 >> Аллісон Бухгольц-AU: Я маю на увазі, Ну, це також буде онлайн. 1119 00:46:01,490 --> 00:46:02,740 Всі слайди будуть он-лайн. 1120 00:46:02,740 --> 00:46:05,470 Так що я просто настійно рекомендую робити це. 1121 00:46:05,470 --> 00:46:07,880 >> Це здорово, як тільки як шпаргалку. 1122 00:46:07,880 --> 00:46:10,690 Це просто все основне команди, які у вас є. 1123 00:46:10,690 --> 00:46:13,070 Це здорово, коли ти перший починаючи свій веб-сайт. 1124 00:46:13,070 --> 00:46:15,080 Тому що, можливо, ви не хочу потрапити в усі 1125 00:46:15,080 --> 00:46:17,355 реальний вошивий піщаний Дизайн-важкий матеріал. 1126 00:46:17,355 --> 00:46:20,230 Вам просто потрібно відформатувати його таким чином, щось має сенс і волю 1127 00:46:20,230 --> 00:46:21,490 зробити для час. 1128 00:46:21,490 --> 00:46:23,580 І якщо ви дійсно хочете щоб потрапити в нього, я знаю, 1129 00:46:23,580 --> 00:46:27,240 Це, як, один з Улюблені посилання Tomas-х років. 1130 00:46:27,240 --> 00:46:30,130 Ми використовували його підготовчого, і це неймовірно. 1131 00:46:30,130 --> 00:46:33,030 Це розробника Mozilla. 1132 00:46:33,030 --> 00:46:36,490 >> ТОМАС Реймерс: Так Mozilla є люди, які роблять Firefox. 1133 00:46:36,490 --> 00:46:40,290 І це тільки їх власна розробник посилання, яка я думаю, це здорово. 1134 00:46:40,290 --> 00:46:44,870 І у цього є чудовий Список ресурсів. 1135 00:46:44,870 --> 00:46:45,530 Таким чином, ми have-- 1136 00:46:45,530 --> 00:46:48,060 >> Аллісон Бухгольц-AU: А потім Останнє зауваження 1137 00:46:48,060 --> 00:46:50,120 коли ви намагаєтеся створити свій веб-сайт, 1138 00:46:50,120 --> 00:46:53,550 черпати натхнення з речей що ви думаєте, досить. 1139 00:46:53,550 --> 00:46:56,340 Перевірка елемента, перевірки вихідного коду 1140 00:46:56,340 --> 00:46:59,370 може бути супер корисно за те, щоб з'ясувати, 1141 00:46:59,370 --> 00:47:02,080 як стиль вашого власного сайту. 1142 00:47:02,080 --> 00:47:04,540 >> Часто я відчуваю себе краще До речі, крім експериментів, 1143 00:47:04,540 --> 00:47:06,290 просто дивитися на речі, які досить. 1144 00:47:06,290 --> 00:47:09,810 Я вважаю, що це дуже важко просто вид конструкції речі на свій розсуд, 1145 00:47:09,810 --> 00:47:11,090 особливо на початку. 1146 00:47:11,090 --> 00:47:14,740 Тому, будь ласка, подивіться на сайтах що вам сподобається дивитися. 1147 00:47:14,740 --> 00:47:16,880 З'ясуйте, що робить їх привабливими для вас. 1148 00:47:16,880 --> 00:47:19,170 І то не соромтеся спробувати повторити це. 1149 00:47:19,170 --> 00:47:20,410 >> ТОМАС Реймерс: Вірно. 1150 00:47:20,410 --> 00:47:23,120 Навіть як веб-сайтів як це, ви можете побачити 1151 00:47:23,120 --> 00:47:25,460 тобто виразно DIV на самому верху. 1152 00:47:25,460 --> 00:47:29,920 І тоді у вас є інший DIV всередині Тут, що УС Awesomeness. 1153 00:47:29,920 --> 00:47:32,480 І тоді у вас є купа посилань тут. 1154 00:47:32,480 --> 00:47:34,770 Якщо ви насправді просто перевірити елементи, ви можете сортувати 1155 00:47:34,770 --> 00:47:38,520 починають бачити те, що роблять сайти виглядати, і як я можу 1156 00:47:38,520 --> 00:47:40,493 відтворити, що якби захотів. 1157 00:47:40,493 --> 00:47:41,890 Чи має це сенс? 1158 00:47:41,890 --> 00:47:43,670 Так у нас є тільки три хвилини залишилося. 1159 00:47:43,670 --> 00:47:46,380 Так питання? 1160 00:47:46,380 --> 00:47:47,650 Будь-який з них? 1161 00:47:47,650 --> 00:47:48,350 Так. 1162 00:47:48,350 --> 00:47:50,780 >> АУДИТОРІЯ: Для кольору прямокутник, як би ви 1163 00:47:50,780 --> 00:47:53,499 have--, якщо ви не хочете його відбувається по всій сторінці, може 1164 00:47:53,499 --> 00:47:56,400 Ви зробили це йти через тільки половина сторінки або просто текст? 1165 00:47:56,400 --> 00:47:59,660 >> ТОМАС Реймерс: Так, абсолютно. 1166 00:47:59,660 --> 00:48:02,780 Отже, дозвольте мені побачити насправді. 1167 00:48:02,780 --> 00:48:04,670 У мене є дві ідеї. 1168 00:48:04,670 --> 00:48:07,265 Отже, перш за все, ви Також можна використовувати відсотків. 1169 00:48:07,265 --> 00:48:08,140 >> АУДИТОРІЯ: Справді? 1170 00:48:08,140 --> 00:48:11,260 >> Аллісон Бухгольц-AU: Так-то щоб подивитися це відносне позиціонування. 1171 00:48:11,260 --> 00:48:13,385 Це те, що ми не було часу, щоб потрапити, 1172 00:48:13,385 --> 00:48:16,392 але це щось я виразно Рекомендуємо ви, хлопці, перевірити. 1173 00:48:16,392 --> 00:48:17,580 >> ТОМАС Реймерс: Так відсотків. 1174 00:48:17,580 --> 00:48:21,524 І подивитися, як ми зробили це тільки 50% від ширини? 1175 00:48:21,524 --> 00:48:24,190 Аллісон Бухгольц-AU: Якщо ви насправді знаємо кількість пікселів, 1176 00:48:24,190 --> 00:48:25,780 Ви можете бути більш точними, що шлях. 1177 00:48:25,780 --> 00:48:27,200 Ви можете возитися з ним. 1178 00:48:27,200 --> 00:48:27,700 Але 50%. 1179 00:48:27,700 --> 00:48:31,970 Якби ми були змінити розмір браузер, було б зробити його менше. 1180 00:48:31,970 --> 00:48:35,250 >> ТОМАС Реймерс: Ну, це в основному 50% прямо зараз, я думаю. 1181 00:48:35,250 --> 00:48:38,820 Це 50%, а потім маржа був доданий до цього. 1182 00:48:38,820 --> 00:48:40,100 CSS має багато примх. 1183 00:48:40,100 --> 00:48:43,195 Так що зараз це 50% від ширини сторінки. 1184 00:48:43,195 --> 00:48:46,860 Але пам'ятайте, що у вас є 10 пікселів зняли з кожного боку. 1185 00:48:46,860 --> 00:48:49,700 Так що якщо ви, щоб перейти, що проти лівий край браузері 1186 00:48:49,700 --> 00:48:51,550 то це виглядатиме 50%. 1187 00:48:51,550 --> 00:48:53,884 Знову ж таки, як я вже сказав, CSS може буде багато ворожіння і-перевірки. 1188 00:48:53,884 --> 00:48:56,049 Як, ти думаєш, що щось буде вести себе в одну сторону, 1189 00:48:56,049 --> 00:48:57,805 але він веде себе зовсім по-іншому. 1190 00:48:57,805 --> 00:48:59,420 >> Аллісон Бухгольц-AU: І ви просто розумніші, 1191 00:48:59,420 --> 00:49:02,020 і ви просто отримаєте краще інтуїція його, як ви рухатися далі. 1192 00:49:02,020 --> 00:49:02,730 >> ТОМАС Реймерс: І це стає все гірше і гірше. 1193 00:49:02,730 --> 00:49:03,496 Так що це насправді просто гонки. 1194 00:49:03,496 --> 00:49:05,454 >> Аллісон Бухгольц-AU: Це супер обнадійливими. 1195 00:49:05,454 --> 00:49:07,070 Ми хочемо, щоб подобається CSS. 1196 00:49:07,070 --> 00:49:08,810 >> ТОМАС Реймерс: CSS є дивним. 1197 00:49:08,810 --> 00:49:10,354 Пам'ятайте про це. 1198 00:49:10,354 --> 00:49:11,020 Інші питання? 1199 00:49:11,020 --> 00:49:14,297 >> Аллісон Бухгольц-AU: одна справа. 1200 00:49:14,297 --> 00:49:14,880 Що-небудь ще? 1201 00:49:14,880 --> 00:49:15,140 Круто. 1202 00:49:15,140 --> 00:49:15,690 >> ТОМАС Реймерс: Awesome. 1203 00:49:15,690 --> 00:49:18,523 >> Аллісон Бухгольц-AU: Ну, якщо ви хлопці, є які-небудь питання пізніше, 1204 00:49:18,523 --> 00:49:20,919 ми завжди доступні як звичайно. 1205 00:49:20,919 --> 00:49:22,960 Ви, ймовірно, побачите деякі З нас, для остаточних проектів 1206 00:49:22,960 --> 00:49:24,280 і, безумовно, на Hackathon. 1207 00:49:24,280 --> 00:49:25,200 >> ТОМАС Реймерс: Абсолютно вірно. 1208 00:49:25,200 --> 00:49:25,720 І на ярмарку. 1209 00:49:25,720 --> 00:49:26,560 >> Аллісон Бухгольц-AU: І на ярмарку. 1210 00:49:26,560 --> 00:49:26,840 Ох. 1211 00:49:26,840 --> 00:49:28,130 >> ТОМАС Реймерс: Подивіться вперед до переглянути весь awesome-- 1212 00:49:28,130 --> 00:49:29,420 >> Аллісон Бухгольц-AU: Ми побачимо, всі ваші дивовижні веб-сайтів 1213 00:49:29,420 --> 00:49:30,572 що буде красиво. 1214 00:49:30,572 --> 00:49:32,780 ТОМАС Реймерс: Ви можете завжди см, як, сайти 1215 00:49:32,780 --> 00:49:36,234 хто мав, начебто, добре CSS, а потім як ті, хто не пробував робити CSS. 1216 00:49:36,234 --> 00:49:39,150 Аллісон Бухгольц-AU: Крім того, інша річ, ще одна річ, щоб подивитися в 1217 00:49:39,150 --> 00:49:40,445 стартує с. 1218 00:49:40,445 --> 00:49:41,805 Так Bootstrap це здорово. 1219 00:49:41,805 --> 00:49:42,240 >> ТОМАС Реймерс: Google, що якщо you-- 1220 00:49:42,240 --> 00:49:43,573 >> Аллісон Бухгольц-AU: Google це. 1221 00:49:43,573 --> 00:49:44,340 Це неймовірно. 1222 00:49:44,340 --> 00:49:45,620 Ви будете любити його. 1223 00:49:45,620 --> 00:49:48,000 І тепер, коли у вас є Базове розуміння CSS, 1224 00:49:48,000 --> 00:49:50,340 це зробить набагато більше сенсу. 1225 00:49:50,340 --> 00:49:50,890 Високий. 1226 00:49:50,890 --> 00:49:51,480 Спасибі, хлопці. 1227 00:49:51,480 --> 00:49:53,330 >> ТОМАС Реймерс: Спасибо так багато. 1228 00:49:53,330 --> 00:49:54,219