Як змінити фон сайту

Як змінити фон сайту

Якщо фон сторінок вашого сайту складається з однієї картинки, яка має ширину сайту і розмножується по вертикалі, то поміняти його можна тільки редагуванням цієї картинки в графічному редакторі. А якщо фон формується в коді сторінок, то їх можна змінити, скориставшись інструкціями наведеними нижче.

Інструкція

  1. Щоб змінити фон, спочатку треба визначити — яким чином він заданий в поточній версії сторінок сайту. Для цього слід відкрити вихідний код сторінки, що лежить на сервері. Це можна зробити звичайним текстовим редактором, підійде стандартний Блокнот. А якщо ви використовуєте яку або систему управління сайтом, то сторінку можна відредагувати прямо в браузері за допомогою вбудованого редактора сторінок.

    HTML-код сторінки (HTML — HyperText Markup Language, «мова розмітки гіпертексту») складається з рядків з інструкціями для браузера, що описують типи, зовнішній вигляд і розташування кожного елемента веб-сторінки. Ці інструкції називають «тегами» і вони згруповані в блоки, один з який починається з відкриваючого тега <body> і закінчується закриває тегом </ body>. Згідно зі стандартами мови HTML у відкриваючому тезі можна задати параметри фону сторінки. Робиться це розміщенням в ньому атрибута bgcolor:

    <body bgcolor=»Green»>

    Тут заданий зелений колір для фону цієї сторінки. Деякі кольори за стандартами HTML мають власні імена — наприклад, Chocolate або Gainsboro, але зазвичай використовують шістнадцяткові коди кольорів:

    <body bgcolor=»#00FF00″>

    Якщо колір фону, заданий цим способом, вам слід, знайти в коді сторінки тег body і замінити значення атрибута bgcolor на потрібне вам.
  2. У сторінках з більш складним дизайном для опису зовнішнього вигляду частіше використовують CSS (Cascading Style Sheets — «каскадні таблиці стилів»). CSS — це мова, створена саме для опису зовнішнього вигляду елементів html-документа. Блоки CSS-коду можуть бути або включені в код сторінки, утримуватися в окремому файлі з розширенням «css» і підключатися до сторінки спеціальною інструкцією у вихідному коді сторінки.

    Вам слід знайти в коді сторінки тег <style> — якщо він буде посилатися на зовнішній файл, то потрібно відкрити для редагування цей самий файл. Виглядати таке посилання може так:

    <style type=»text/css» media=»all»> @ import «style.css»; </ style>

    А якщо після тега <style> відразу йдуть інструкції, а не посилання на файл, то редагувати стилі треба тут. В обох випадках вам треба шукати ту частину опису стилів, яка відноситься до тіла документа — body. Але в мові CSS це вже буде називатися не «тегом» а «селектором», і виглядати може, наприклад, так:

    body {

    background-color: Green;

    color: White;

    }

    Вам треба замінити значення параметра background-color — він задає колір фону сторінки. І тут теж є можливість вказувати деякі колірні відтінки по іменах, але краще використовувати шістнадцяткові значення. Наприклад, шістнадцяткове значення для відтінку Chocolate = # D2691E.

    Є можливість вказати не тільки колір, але і зображення для фону:

    body {

    background: Green url (img / bg.jpg) repeat-x;

    color: White;

    }

    Тут url (img / bg.jpg) означає, що з папки img для фону сторінки буде братися картинка з ім’ям bg.jpg, а repeat-x означає, що вона буде розмножена по осі X, тобто по горизонталі. Все інше простір сторінки, не закрите картинкою буде мати зелений фон — він вказаний перед параметром url. Щоб картинка була розмножена по осі Y (по вертикалі), треба вказати, відповідно, repeat-y. A no-repeat відключить всяку реплікацію фонової картинки.

Корисні поради

З’ясувати значення шістнадцяткового коду для потрібного вам відтінку кольору допоможуть сайти з он-лайн конвертерами квітів, або спеціальні програми — наприклад — ColorImpact і Ruler.