Як зробити випадаючий список
Відео: Як створити список, що випадає в excel. Найпростіший спосіб
На сторінках сайтів в мережі дуже часто присутні списки, що випадають. Їх використовують для того, щоб згрупувати однотипні значення, якщо треба заощадити місце на сторінці, або щоб при заповненні будь-якої форми дати відвідувачеві можливість вибрати один пункт з декількох, або щоб організувати компактне меню і т.д. Розглянемо - як робиться випадає перелік.
Всі елементи сторінки сайту створюються браузером, який читає з надісланого йому сервером коду що саме і де саме на цій сторінці треба розмістити. Цей код мови HTML (HyperText Markup Language - «мова розмітки гіпертексту») «тегів», які описують тип, зовнішній вигляд і розташування елементів веб-сторінки. Стандартний список, що випадає перелік створюється браузером, якщо він зустрічає в коді сторінки тег select. Виглядає він так: Тут "name" - це «атрибут» тега select, який містить ім`я саме цього списку. кожен випадає перелік на сторінці має власне ім`я. Крім імені можуть бути зазначені й інші атрибути списку, наприклад кольору фону і тексту вказується в атрибуті style: Вміст списку (рядки) перераховуються в інших тегах - option: рядок перваяУ тега option повинен бути атрибут value - значення, яке буде передано, коли відвідувач зробить свій вибір і відправить його на сервер. Зверніть увагу - саме значення тега value буде відправлено, а не те, що відвідувач побачить в випадаючому списку ( "рядок перша"). І у тега option можуть бути інші атрибути крім value, один з них - selected. Цей атрибут вказує, що цей рядок списку повинна бути обрана за замовчуванням, тобто саме вона буде видна при закритому списку: друга строкаКаждой рядку списку відповідає окремий тег option і всі вони повинні розташовуватися всередині контейнера select, тобто до закриває тега: рядок перша
другий рядок
це третя строкаА контейнер select, в свою чергу, зазвичай є одним з елементів форми і знаходиться всередині її тегів її відкривають і закривають: рядок перша
другий рядок
це третя строкаЕтот простий перелік з трьох рядків, в якому за замовчуванням обрана другий рядок на сторінці буде виглядати так:
другий рядок
це третя строкаА контейнер select, в свою чергу, зазвичай є одним з елементів форми і знаходиться всередині її тегів її відкривають і закривають: рядок перша
другий рядок
це третя строкаЕтот простий перелік з трьох рядків, в якому за замовчуванням обрана другий рядок на сторінці буде виглядати так:
список "class =" lightbx "data-lightbox =" article-image "gt;
2
Щоб в випадаючому списку і в згорнутому стані було видно кілька рядків в тезі select треба додати атрибут size з кількістю видимих елементів: рядок перша
другий рядок
це третій рядок
другий рядок
це третій рядок
3
Ширина списку визначається найдовшою його рядком, але її можна змінювати за допомогою стилів: рядок перша
другий рядок
це третя строкаШіріна задається в «пікселах» - така одиниця виміру в основному використовується при розмітці html-сторінок.
другий рядок
це третя строкаШіріна задається в «пікселах» - така одиниця виміру в основному використовується при розмітці html-сторінок.
4
Є можливість вибирати в списку не одну, а одночасно кілька рядків. Для цього в тег select слід додати атрибут multiple: рядок перша
другий рядок
це третя строкаЕсть і інші варіації функціональних можливостей списку. В основному вони вимагають на додаток до мови HTML використовувати мови jаvascript і CSS.
другий рядок
це третя строкаЕсть і інші варіації функціональних можливостей списку. В основному вони вимагають на додаток до мови HTML використовувати мови jаvascript і CSS.
Поділися в соціальних мережах:
Схожі
- Як змінити посилання
- Як змінити заголовок
- Як змінити фон сайту
- Як встановити фон на сайт
- Як зробити, щоб сторінка відкрилася в новому вікні
- Як передати значення
- Як зробити гіперпосилання на сайті
- Як зробити кнопку неактивній
- Як викласти файл на свій сайт
- Як задати ширину таблиці
- Що таке html-код сторінки сайту
- Як помістити посилання
- Як додати посилання на сторінку
- Як редагувати html код
- Як зробити html форму
- Як зробити сторінку в сторінці
- Як вставити сторінку в сторінку
- Як задати колір фону
- Як помістити форму
- Як зробити сайт по центру
- Як розмістити флеш на своєму сайті