目录
- HOW TO
-
Menus
- Icon Bar
- Menu Icon
- Accordion
- Tabs
- Vertical Tabs
- Tab Headers
- Full Page Tabs
- Hover Tabs
- Top Navigation
- Responsive Topnav
- Split Navigation
- Navbar with Icons
- Search Menu
- Search Bar
- Fixed Sidebar
- Side Navigation
- Responsive Sidebar
- Fullscreen Navigation
- Off-Canvas Menu
- Hover Sidenav Buttons
- Sidebar with Icons
- Horizontal Scroll Menu
- Vertical Menu
- Bottom Navigation
- Responsive Bottom Nav
- Bottom Border Nav Links
- Right Aligned Menu Links
- Centered Menu Link
- Equal Width Menu Links
- Fixed Menu
- Slide Down Bar on Scroll
- Hide Navbar on Scroll
- Shrink Navbar on Scroll
- Sticky Navbar
- Navbar on Image
- Hover Dropdowns
- Click Dropdowns
- Cascading Dropdown
- Dropdown in Topnav
- Dropdown in Sidenav
- Resp Navbar Dropdown
- Subnavigation Menu
- Dropup
- Mega Menu
- Mobile Menu
- Curtain Menu
- Collapsed Sidebar
- Collapsed Sidepanel
- Pagination
- Breadcrumbs
- Button Group
- Vertical Button Group
- Sticky Social Bar
- Pill Navigation
- Responsive Header
-
Images
- Slideshow
- Slideshow Gallery
- Modal Images
- Lightbox
- Responsive Image Grid
- Image Grid
- Image Gallery
- Scrollable Image Gallery
- Tab Gallery
- Image Overlay Fade
- Image Overlay Slide
- Image Overlay Zoom
- Image Overlay Title
- Image Overlay Icon
- Image Effects
- Black and White Image
- Image Text
- Image Text Blocks
- Transparent Image Text
- Full Page Image
- Form on Image
- Hero Image
- Blur Background Image
- Change Bg on Scroll
- Side-by-Side Images
- Rounded Images
- Avatar Images
- Responsive Images
- Center Images
- Thumbnails
- Border Around Image
- Meet the Team
- Sticky Image
- Flip an Image
- Shake an Image
- Portfolio Gallery
- Portfolio with Filtering
- Image Zoom
- Image Magnifier Glass
- Image Comparison Slider
- Favicon
-
Buttons
- Alert Buttons
- Outline Buttons
- Split Buttons
- Animated Buttons
- Fading Buttons
- Button on Image
- Social Media Buttons
- Read More Read Less
- Loading Buttons
- Download Buttons
- Pill Buttons
- Notification Button
- Icon Buttons
- Next/prev Buttons
- More Button in Nav
- Block Buttons
- Text Buttons
- Round Buttons
- Scroll To Top Button
-
Forms
- Login Form
- Signup Form
- Checkout Form
- Contact Form
- Social Login Form
- Register Form
- Form with Icons
- Newsletter
- Stacked Form
- Responsive Form
- Popup Form
- Inline Form
- Clear Input Field
- Hide Number Arrows
- Copy Text to Clipboard
- Animated Search
- Search Button
- Fullscreen Search
- Input Field in Navbar
- Login Form in Navbar
- Custom Checkbox/Radio
- Custom Select
- Toggle Switch
- Check Checkbox
- Detect Caps Lock
- Trigger Button on Enter
- Password Validation
- Toggle Password Visibility
- Multiple Step Form
- Autocomplete
- Turn off autocomplete
- Turn off spellcheck
- File Upload Button
- Empty Input Validation
- Filters
- Tables
-
More
- Fullscreen Video
- Modal Boxes
- Delete Modal
- Timeline
- Scroll Indicator
- Progress Bars
- Skill Bar
- Range Sliders
- Color Picker
- Email Field
- Tooltips
- Display Element Hover
- Popups
- Collapsible
- Calendar
- HTML Includes
- To Do List
- Loaders
- Badges
- Star Rating
- User Rating
- Overlay Effect
- Contact Chips
- Cards
- Flip Card
- Profile Card
- Product Card
- Alerts
- Callout
- Notes
- Labels
- Ribbon
- Tag Cloud
- Circles
- Style HR
- Coupon
- List Group
- List Group with Badges
- List Without Bullets
- Responsive Text
- Cutout Text
- Glowing Text
- Fixed Footer
- Sticky Element
- Equal Height
- Clearfix
- Responsive Floats
- Snackbar
- Fullscreen Window
- Scroll Drawing
- Smooth Scroll
- Gradient Bg Scroll
- Sticky Header
- Shrink Header on Scroll
- Pricing Table
- Parallax
- Aspect Ratio
- Responsive Iframes
- Toggle Like/Dislike
- Toggle Hide/Show
- Toggle Dark Mode
- Toggle Text
- Toggle Class
- Add Class
- Remove Class
- Change Class
- Active Class
- Tree View
- Remove Decimals
- Remove Property
- Offline Detection
- Find Hidden Element
- Redirect Webpage
- Format a Number
- Zoom Hover
- Flip Box
- Center Vertically
- Center Button in DIV
- Center a List
- Transition on Hover
- Arrows
- Shapes
- Download Link
- Full Height Element
- Browser Window
- Custom Scrollbar
- Hide Scrollbar
- Show/Force Scrollbar
- Device Look
- Contenteditable Border
- Placeholder Color
- Disable Resizing of Textarea
- Disable Text Selection
- Text Selection Color
- Bullet Color
- Vertical Line
- Dividers
- Text Divider
- Animate Icons
- Countdown Timer
- Typewriter
- Coming Soon Page
- Chat Messages
- Popup Chat Window
- Split Screen
- Testimonials
- Section Counter
- Quotes Slideshow
- Closable List Items
- Typical Device Breakpoints
- Draggable HTML Element
- JS Media Queries
- Syntax Highlighter
- JS Animations
- JS String Length
- JS Exponentiation
- JS Default Parameters
- JS Random Number
- JS Sort Numeric Array
- JS Spread Operator
- JS Scroll Into View
- Get Current Date
- Get Current URL
- Get Current Screen Size
- Get Iframe Elements
-
Website
- Create a Free Website
- Make a Website
- Make a Static Website
- Host a Static Website
- Make a Website (W3.CSS)
- Make a Website (BS3)
- Make a Website (BS4)
- Make a Website (BS5)
- Create and View a Website
- Create a Link Tree Website
- Create a Portfolio
- Create a Resume
- Make a Restaurant Website
- Make a Business Website
- Make a WebBook
- Center Website
- Contact Section
- About Page
- Big Header
- Example Website
- Grid
- Converters
- Blog
How TO - Device Look
Learn how to create different device looks (smartphone, tablet and laptop) with CSS.
Devices
截取页面反馈部分，让我们更快修复内容！也可以直接跳过填写反馈内容!