: 16px; FONT-FAMILY: arial, verdana, sans-serif; color: black} - це опис стилю для біжучого рядка, її можете вставляти за бажанням, якщо вона не потрібна видаліть її;
p {padding-left: 0px; padding-right: 15px; } - Вказує межі тексту поміщеного в теги lt; p gt ;;
. Nav2 {COLOR: # 000000; text-align: middle; font-weight: bold; } - Розташування і колір тексту класу Nav2, в даному прикладі колір чорний, текст жирний, розташовується посередині;
. Nav2 A: link {COLOR: # 000000; text-decoration: none; font-weight: bold; } - Колір посилання, text-decoration: none: - означає, що посилання не буде підкресленою, якщо замість none написати underline , посилання буде підкресленою;
- .Nav2 A: visited {COLOR: # 000 text-decoration: none; font-weight: bold; } - Колір і шрифт відвіданого посилання;
. Nav2 A: hover {COLOR: # DC143C; text-decoration: none font-weight: bold;} - Колір посилання при наведенні на неї курсора.
Тепер зберігаємо файл style.css, а в сторінці сайту між тегами lt; HEAD gt; і lt;/HEAD gt; додаємо посилання на файл CSS, в коді сторінки сайту це буде виглядати так:
lt; HTML gt;
lt; HEAD gt;
lt; TITLE gt; lt;/TITLE gt;
lt; LINK href= style.css type=text/css rel= stylesheet gt;
lt;/HEAD gt;
lt; BODY gt;
Якщо у вас одна або декілька сторінок сайту, стилі можна прописувати в самій сторінці сайту так:
lt; HTML gt;
lt; HEAD gt;
lt; TITLE gt; lt;/TITLE gt;
lt; STYLE type= text/css gt;
lt;! -
Тут буде сам опис стилів
- gt;
lt;/STYLE gt;
lt;/HEAD gt;
lt; BODY gt;
1.9 Оптимізація структури сайту
Структура сайту, це правильне формування опублікованих матеріалів, поділ їх на розділи і категорії, розташування файлів сайту, створення зручного меню та ін.
Якщо на вашому письмовому столі немає висувних ящиків, куди можна складати документи, то дуже скоро, ви перестанете орієнтуватися в них. Те ж саме і з комп'ютером, єдина відмінність полягає в тому, що комп'ютер володіє більш гнучкими можливостями. Наприклад, місткість висувних ящиків письмового столу обмежена, а «висувні ящики» комп'ютера можуть бути розташовані на Ваш розсуд і в них помістяться всі ваші документи.
Подивіться на свій письмовий стіл, і ви переконаєтеся, що там зберігаються різні речі: листи, фотографії, ділові папери та багато іншого. Якщо у вас на столі порядок, то всі ці речі розкладені по папках згідно встановленим вами критеріям, а папки в свою чергу, розкладені по висувним ящиків.
Так само йде справа і з файлами на комп'ютері і з файлами сайту, які повинні бути перенесені на сервер в інтернеті, і якщо відразу не навести порядок то, у міру зростання сайту, додавання матеріалів, картинок та ін., вже самому буде важко розібратися, де що лежить і настає час, коли доводиться цей порядок наводити. А адже вже сформовані посилання на матеріали, які потрібно буде переробляти, також сторінки вже проіндексовані пошуковими системами і при переміщенні потрібно переіндексація, в результаті можна втратити частину вже досягнутого трафіку
Якщо в готових СMS-системах структура сформована, і для того щоб створити там нову сторінку, треба вказати до якого розділу і категорії вона відноситься, то в звичайному HTML-сайті ви самі вирішуєте як і в якій послідовності будуть розташовані файли. Можна всі файли скласти упереміж в одну папку, в результаті може вийде як на картинці. Правда тут показано невелику кількість файлів, на практиці їх може виявитися набагато більше і навіть нехай файли в папці будуть впорядковані за типом і алфавітом, все одно, коли файлів буде багато, робота з ними ускладниться.
Зазвичай у складі сайту є картинки, відеофайли, скрипти, файли для скачування та інші, все це потрібно впорядкувати. Для картинок створюється окрема папка images. Якщо картинок багато, в папці images, створіть додаткові папки, наприклад, картинки для оформлення дизайну сайту, можна скласти в саму папку images, інші картинки можна розподілити або за видами, наприклад смайли в одну папку, фотографії в іншу і так далі. Головне не забувайте правильно прописувати шлях до картинки. Якщо для картинки лежить в самій папці images шлях буде lt; img src= images/ппп.jpg gt ;, то для картинки лежить в окремій п...