>> СПІКЕР: Виходить, що HTML не єдина мова, яку ви можете використовувати всередині
веб-сторінки.
Ви можете використовувати те, що називається CSS, або Каскадні таблиці стилів, а також.
CSS дозволяє задати набагато більше саме естетика Мережі
сторінки, в тому числі планування і розмірів і кольори і шрифти та багато іншого.
Наприклад, давайте створювати веб-сторінки тут називається css0, що являє собою
Домашня сторінка для, скажімо, Джона Гарварда.
>> На цій сторінці ми будемо мати Джон Гарварда ім'я, під яким буде
хороший повідомлення для своїх відвідувачів, під який буде підвал, з
кажуть, деякі відомості про авторські права.
Щоб зробити це, давайте визначимо три підрозділи для сторінки за допомогою тега
називається справ.
Відкрити кронштейн справ, Джон Гарвард, недалеко Кронштейн справ, ще один відкритий кронштейн справ,
і тепер ми будемо вказати щось як, ласкаво просимо на мою сторінку!
І давайте закриємо цю DIV, а також.
>> І тепер третій і останній справ, авторське право.
Просто бути фантазії, дозвольте мені використовувати зараз в HTML особа, символ, який представляє
символ, який ви не могли інакше друкувати на клавіатурі.
Зокрема, я збираюся зробити амперсанд, фунт, 169, крапка з комою.
Виявляється, що це цифровий код для символу авторського права.
Тоді давайте уточнимо Джон Гарвард тут в нижній частині.
Закриємо DIV і збережіть файл.
>> Тепер, що ж це за справ тег?
Справ тег просто визначає поділ сторінки, який є по суті
прямокутна область.
Так що в цей момент часу, у мене є три прямокутні області, один на вершині
від іншого.
Так що на даний ефект майже як хоча я повинен був три абзаци.
Але ми не побачимо в тій же мірі прогалини між ними.
>> Давайте зберегти цей файл, змінити його дозволу, і поглянути на
момент в Chrome.
Chmod + R CSS0.html.
Давайте тепер відкрити Chrome і візит http://localhost.CSS0.html.
Справді, ось домашня сторінка Джона Гарварда.
Давайте тепер стилізувати його трохи більше Саме за допомогою деяких CSS.
>> Повернутися в Gedit, давайте увійдемо в цей Перший справ теги і додати стиль
атрибутів уточнивши, що я хотів би розмір шрифту, скажімо, 36 пікселів, або пікс.
І я хотів би вага цього шрифту бути сміливим, а не за замовчуванням,
який є нормальним.
Для другого DIV, давайте уточнимо інший атрибут стилю, який має
Розмір шрифту 24 пікселів, так що трохи менше.
Закрити котирування після коми.
>> Нарешті, в цьому третьому DIV, давайте зробимо стиль дорівнює розмір цитати, шрифт, і
скажімо 12 пікселів на цей раз.
Закрити цитата після коми.
Зверніть увагу, те, що я, здається, зазначено трохи стилізації для
кожен з цих трьох DIVs з використанням, Виявляється, CSS.
Насправді, синтаксис, що ви бачите в між цими подвійні лапки є CSS,
спеціально CSS властивості зі значеннями.
І з цієї першого тега, де я мав дві такі властивості, розмір шрифту і
вага шрифту, я просто відділена їх крапкою з комою.
>> Тепер, просто заради стилю, я також включені Крапка з комою в
кінець кожного рядка.
Але вони не обов'язково, особливо коли у вас є тільки один
властивість, яке визначається.
Давайте тепер збережіть файл і перезавантажте в Chrome, і подивитися, що
чистий ефект.
Повернутися в Chrome тут, давайте натисніть Оновити.
>> Тепер у нас є трохи більш цікавий Домашня сторінка для Іоанна
Гарвард, в результаті чого перша лінія з його ім'я, яке знаходиться всередині, що
Перший справ, становить 36 пікселів у висоту, а також напівжирний, причому другий рядок,
який цього другого DIV, 24 пікселів у висоту, але не жирним шрифтом.
І при цьому третій рядок в цьому третина справ становить 12 пікселів у висоту, а також
НЕ жирним шрифтом.
Але припустимо, що тепер я хотів би перейти весь цей текст над
таким чином, що вона по центру.
>> Я міг вирівняти кожен з особистості діви як по центру.
Але легше, я міг обернути тих, три діви всередині четвертого DIV,
батько справ, так би мовити, і вкажіть що, що справ і всі його
нащадки повинні бути Текст вирівнюється центр?
Давайте поглянемо.
>> Усередині Gedit, давайте повернемося до мого тіло і додати новий DIV нагорі з
справ, стиль дорівнює цитатою кінець цитати Текст по центру, близько
цитую після коми.
А тепер, давайте йти вперед і відступ все з тих ліній, які ми ввели раніше.
І нижче цієї третьої DIV, давайте закрити цю нову DIV.
>> Іншими словами, так як ці три оригінальні діви тепер діти, так
говорити, нового батьківського DIV і у мене є вказано, що я хотів би, щоб вирівняти
Текст цього батьківського сну в центрі сторінки, що майно буде
успадковуються всі з цих дітей.
Справді, давайте збережіть файл і поглянути в браузері.
Давайте перезавантажити в Chrome.
І у нас це є, ще приємніше Домашня сторінка для Джона Гарварда.