Вступ до панелей завантаження
Зміст даних повинен бути чітким, акуратним та відповідним. Маючи простір у вмісті, кольоровий колонтитул та колонтитул та рамки для вмісту, виглядає привабливо. Привабливий контент простий для читання та розуміння. Панель завантаження працює точно за змістом. Він використовується для рамки для вмісту з певним накладом. Він працює для вмісту, заголовка, колонтитула, а також іншого кольору. Базова робота панелі завантаження з використанням класу ".panel" в елементі div, для цього також потрібен клас ".panel-default".
Приклад:
THIS IS A DEFAULT PANEL
Вихід:
Типи панелей завантаження
Панелі класифікуються з різними класифікаціями та цілями, які є наступними. Вміст містить частину заголовка, тіла та колонтитула. Щоб створити елегантний зміст та стиль за призначенням, панель пропонує такі категорії:
1. Панель із заголовком
У заголовку панелі рамка облямована заголовком вмісту та тілом змісту з форматом. Панель заголовка add class = "заголовок панелі" та тіло вмісту add class = "body-body".
Код:
Content Heading
Content Body
Вихід:
Ви можете додати class = "title-title", щоб змінити заголовок вмісту окремо. Цей клас використовується рідко, оскільки клас заголовка панелі змінює всі стилі самостійно.
2. Панель із колонтитулом
У нижньому колонтитулі панелі, обкладеному колонтитулом контенту та тілом вмісту з форматним набиванням. Панель нижнього колонтитулу add class = "панель-колонтитул" та тіло вмісту add class = "body-body".
Код:
Content Body
Content Footer
Вихід:
3. Панельна група
Ця панель використовується для прив'язки багатьох панелей одночасно. Він знімає поле нижньої панелі і складає групу панелей.
Код:
Content Body1
Content Heading
Content Body
Content Body3
Content Footer
Вихід:
4. Панелі з контекстуальними класами
Для отримання більш значущого дизайну панелі завантажувального контексту різні класи для контексту. Кожна заголовок контекстуального класу має різний колір, щоб показати вплив контексту. Ці класи на панелі нижче наведені з їх прикладами та результатами,
- .panel-default: Це панель за замовчуванням, що використовується для контексту.
Код:
Content Heading
Content Body
Вихід:
- .panel-Primary: Цей клас, що використовується для основного контексту, означає основні контексти.
Код:
Content Heading with panel-primary class /div>
Content Body2
Вихід:
- .panel-success: Цей клас використовується, коли деякий контекст має значення успіху.
Код:
Content Heading with panel-success class
Content Body3
Вихід:
- .panel-info: Цей клас використовується, коли деякий контекст має інформативний характер.
Код:
Content Heading with panel-info class
Content Body4
Вихід:
- .panel-попередження: Цей клас використовується, коли деякий контекст має значення попереджувального знаку.
Код:
Content Heading with panel-warning class
Content Body5
Вихід:
- .panel-небезпека: Цей клас використовується, коли якийсь контекст має значення небезпеки і хоче вказати.
Код:
Content Heading with panel-danger class
Content Body6
Вихід:
Приклади панелей завантаження
Нижче наведено приклади панелі завантажувальної програми, що детально пояснена,
Приклад №1: Проста панель завантаження
Це простий приклад панелі завантаження за замовчуванням, де розміщуються заголовок панелі, колонтитул панелі та тіло опису.
Код:
Content Heading
Content Body
Panel body for context
Content Footer
Вихід:
Приклад №2: Панель завантаження з таблицею
- У цьому прикладі отримайте результат таблиці за допомогою панелі завантаження. Стіл можна модифікувати, щоб він виглядав елегантно. Наступний приклад та результат - таблиця, що використовує панель завантаження.
- У цьому прикладі потрібен клас таблиці, щоб зробити таблицю. Це робить основний клас та заголовок панелі зберігає ім’я таблиці.
- Клас таблиці складається з класом корпусу панелі. У цій таблиці розміщуються заголовки та дані таблиці.
Код:
Table Name
Brand Name
Brand Price (Rs)
Brand A
500
Brand B
400
Brand C
700
