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