Data driven solutions for your business
We build modern websites and digital experiences. Practice your test automation with Bootstrap 5.
Student Information
Student Details (Shadow DOM)
Parent Details (Shadow DOM)
Father's Details (Iframe)
Mother's Details (Shadow DOM)
Child Details (Standard Table)
| Child Name | Age | Grade |
|---|---|---|
| Emily Doe | 10 | 5th Grade |
| James Smith | 7 | 2nd Grade |
1. Drag & Drop Zone
Drag and drop a file here, or click to select
2. Text Box + Browse Button
3. Standard HTML Input
4. Multiple Files Upload
5. Image Upload with Preview
Assignment.docx
Microsoft Word
Notes.txt
Plain Text
Grades.csv
CSV Data
Coding Image
Student Records
Page 1 of 10| ID | Name | Grade |
|---|
Employee Data Grid
Student Table
| Student Name | Parent Name | Age | Profile Link | Action | Edit / Delete |
|---|---|---|---|---|---|
| Emma Thompson | Robert Thompson | 14 | View Profile | ||
| Liam Johnson | Sarah Johnson | 15 | View Profile | ||
| Olivia Williams | Michael Williams | 13 | View Profile | ||
| Noah Brown | Jennifer Brown | 16 | View Profile | ||
| Ava Davis | David Davis | 14 | View Profile | ||
| Ethan Miller | Lisa Miller | 15 | View Profile | ||
| Sophia Wilson | James Wilson | 13 | View Profile | ||
| Mason Moore | Patricia Moore | 16 | View Profile | ||
| Isabella Taylor | Christopher Taylor | 14 | View Profile | ||
| Lucas Anderson | Amanda Anderson | 15 | View Profile |
Registration Successful!
1. Slider/Range Controls
2. Toggle Switches
3. Progress Indicators
4. Modal/Dialog
5. Alerts & Notifications
6. Menu/Dropdown
7. Tabs
Overview Content
This is the overview tab panel. It contains general information about the subject.
Details Content
This is the details tab panel. It contains more specific information and specifications.
Settings Content
This is the settings tab panel. It contains configuration options and preferences.
8. Media (Video/Audio)
9. Loading States
Spinner
Growing Spinner
10. Breadcrumb Navigation
11. Accordion
This is the first accordion section. Accordions are useful for organizing content in a compact, expandable format. Click on other sections to see them expand while this one collapses.
This section describes the features. Accordions can contain any type of content including text, images, forms, and other components.
- Feature 1: Expandable sections
- Feature 2: Single or multiple open
- Feature 3: Keyboard accessible
Q: How do I use the accordion?
A: Click on any section header to expand or collapse that section.
Q: Can multiple sections be open?
A: This accordion is configured to close other sections when one is opened, but that can be changed.
12. Lists
- First item
- Sub-item a
- Sub-item b
- Sub-item c
- Second item
- Third item
- Fourth item
- Fifth item
- Apple
- Red Apple
- Green Apple
- Banana
- Cherry
- Date
- Elderberry
13. Tree View
Currently Selected:
Instructions:
- Click on a folder or file to select it
- Click the chevron icon to expand/collapse folders
- Documents and Images folders are expanded by default
14. Radio Button Group
Currently Selected:
15. External Link
Click the link below to open an external website in a new browser tab:
Click Here