Прохолодний HTML Ефекти

Прохолодний HTML Ефекти

З додаванням якийсь класний HTML ефекти до вашої веб-сторінки, ви можете створити воістину дивовижний досвід користувача і дійсно зробити ваше повідомлення поп-музики. Ось чотири прості методи, щоб спробувати, які не приймають передових знань

Чотири Прохолодний HTML ефекти, щоб Спробуйте сьогодні


Кожен з цих ефектів не вимагають великого досвіду кодування на всіх, і що більш важливо, що вони "в лінію" ефектів, на відміну від функції введені в головній частині вашого HTML-коду. Вони також не будь JavaScript; це просто теги, які дають зміст невеликий додатковий протяжний звук.

1. Виділення тексту

Якщо у вас є трохи тексту, який ви хотіли б підкреслити, використовуючи інший колір фону, ви повинні були б використовувати <FONT> теги, а також "кольорові" властивості. Тим не менш, це дуже останнього тисячоліття; з сучасними кодерами використовувати <SPAN STYLE=> тега. Це може бути використано в будь-якому місці документа, і буде потрібно багато різних властивостей.

Код, який особливо корисний, коли підсвічування тексту колір фону стиль. Використання схема колірні коди , ви можете вибрати потрібний відтінок підкреслити (і це хороше правило: використовувати тільки один колір виділити для вашого сайту, для забезпечення узгодженості). Отриманий код буде виглядати приблизно так:

<span style= "background-color: #FFFF00"> Цей текст буде виділений жовтим кольором. </ SPAN>

2. Введення в Фонове зображення

Колір за текстом це одне, але як здорово було б покласти конкретне зображення позаду тексту може бути? Це займе трохи більше передбачливості, або використовувати текстуру йти за текстом при нормальному розмірі, або збільшити розмір тексту, так що ви можете побачити повний образ. Це може зайняти деякий налаштування і редагування зображень, щоб отримати ефект, абсолютно вірно, але це йде довгий шлях до легко персоналізувати дизайн свого сайту і зробити його виділитися з натовпу.

Знову ж таки, цей ефект дає використання SPAN STYLE = тега, на цей раз слід фонового зображення: URL (вставити зображення) стилі. Не забудьте додати в лапки стилю і вартості (яка буде розташування фонового зображення):

<SPAN STYLE="background-image: url(http://www.yoursite.com/image/HTMLBackgroundImage.jpg); font-size: 20pt"> Це буде 20 кегль! </ SPAN>

Пам'ятайте, щоб бути обережним, щоб не створити образ, який настільки зайнятий, що робить текст важко читати!

3. Додавання Alt Text

Альтернативний текст (також звані "підказки") є те, що ви отримуєте, коли наведенні покажчика миші на певний елемент на веб-сторінці. Для зображень, він часто використовується, щоб зробити сайти доступнішими для людей з обмеженими можливостями, він також часто використовується як допоміжний засіб для навігації по сайту, наприклад, кажучи "НАТИСНІТЬ ТУТ для більшої кількості статей" на посилання, яка просто говорить ІСТОРІЇ. Іншими словами, він додає вміст сторінки, в іншому випадку прихованою, вона requres наведенні курсору миші, щоб показати текст. Знову використовуючи SPAN тег, але на цей раз з назвою замість STYLE, додавши, альтернативний текст, щоб будь-який текст можна зробити швидко, а саме:






 <span title="This б ALT text."> Наведіть вказівник на цей текст буде показувати ALT текст </ SPAN>



Це може бути гарною ідеєю, щоб не занадто захоплюватися з ALT текст, так само, як фонове зображення, мета будь-якого веб-сайту є чітке послання, і це може бути небезпечним при неправильному використанні.

4. Вставка рухомого рядка

Будь-який дизайнер, який мав більше тексту, ніж може легко поміститися на сторінці можна використовувати щось на зразок цього - вікна прокрутки тексту. Більшість думаю, що це займає багато програмування, однак, у той час як ви можете налаштувати його широко (як показано нижче, з великою кількістю спеціальних кодів кольору), це насправді досить проста кодування HTML:

<Справ стиль = "Ширина: 50%; висота: 75px; переповнення: авто; прокрутки особі кольори: # CE7E00; прокрутки-тіні кольору: # FFFFFF; руб. / Полоса прокрутки-підкреслити кольори: # 6F4709; прокрутки-3dlight кольори: # 11111; прокрутки-Darkshadow кольори: # 6F4709; руб. / полоса прокрутки-трек кольори: # FFE8C1; прокручування стрілку кольори: # 6F4709; "> Написати досить тексту тут, щоб поповнити свій 75 пікселів високої вікна, так що ви можете побачити досить прокрутки поруч з ним! </ P>

Мережі багато багато інших кодів, які можна використовувати, це лише верхівка айсберга. Перевірте веб-дизайну ВікіОсвіта на сторінку тільки початок.

Див також