Apple iweb виводимо текст у вікні з прокруткою

Створюємо вікна з прокруткою за допомогою тега
і сниппета HTML

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

Тепер ці кроки більш докладно. Визначаємося для себе, якого розміру має бути вікно і які смуги прокрутки потрібні в ньому.

border: 1px solid # 999; »>

Опускаємося нижче по html коду і, після останнього закриває тега

перед , вставляємо ще два тега
. Змінюємо властивості:

width: 540px - ширина майбутнього вікна з прокруткою;

height: 200px - висота майбутнього вікна з прокруткою;

width: 520px - ширина створеної сторінки з текстом.

Щоб було зрозуміліше, як вибирати ці розміри, подивіться на ділянки даного коду, зі значеннями для різних випадків застосування:

Код для вікна з вертикальною смугою прокрутки.

Сторінка з текстом, який будемо «прокручувати», має ширину 520px, розміри вікна 540px на 200px (540px-520px = 20px - необхідні для відображення самої смуги прокрутки):

border: 1px solid # 999; »>

Такий самий пароль, але для вікна з прокруткою по вертикалі і горизонталі.

Сторінка з текстом, який будемо перекручувати, має ширину 720px, розміри вікна 540px на 200px:

border: 1px solid # 999; »>

Змінюємо значення width. height і width. виходячи з ваших розмірів вікна і сторінки, зберігаємо зміни. Сподіваюся Ви вже здогадалися, що вихідний код цієї сторінки ми і будемо вставляти в сниппет HTML на основній сторінці, тому зробимо ще кілька змін. Змінимо шлях до папок «Scripts» і «Media». додавши до них «../» в наступних рядках (передбачається, що сторінка з вікном буде знаходитися в корені сайту):

Тепер можете відкрити сторінку в будь-якому браузері - ви повинні побачити вікно з текстом допоміжної сторінки, який повинен прокручуватися. На даному етапі це вікно може виглядати приблизно так:

Схожі статті