Home
Docs
Resources
Tools
Contact Us
Typing Test
বাংলা
Toggle Sidebar
Start Here
Computer Basics
20
Office Skills
37
Intro to Programming
20
Artificial Intelligence
24
Cybersecurity
18
Git & GitHub
25
Design
Graphic Design
18
UI/UX Design Principles
32
Photoshop
12
Figma
17
Build the web
HTML
43
CSS
49
Introduction of CSS
CSS Syntax
CSS Colors
CSS Background
CSS Border
CSS Margin
CSS Padding
CSS Dimension
CSS Box Model
CSS Outline
CSS Text
CSS Fonts
CSS Icons
CSS Link
CSS List
CSS Table
CSS Visibility
CSS Max-width
CSS Position
CSS Overflow
CSS Float
CSS Layout
CSS Align
CSS Combinators
CSS Pseudo Class
CSS Pseudo Elements
CSS Speficity
CSS Opacity
CSS Navbar
CSS Dropdowns
CSS Form
CSS Units
CSS How To
Bootstrap
CSS Flexbox
CSS Grid
CSS Transforms
CSS Transitions
CSS Animations
CSS Media Queries & Responsive Design
CSS Variables (Custom Properties)
CSS Functions — calc(), min(), max(), clamp()
CSS Attribute Selectors
CSS Multi-column Layout
Using Google Fonts
CSS Font Shorthand
Responsive Typography
CSS Accessibility & Performance Basics
Design Systems & Component Thinking
JavaScript
34
React
28
Backend & data
PHP
41
SQL
22
WordPress
31
Python
38
Node.js
34
MongoDB
26
Launch & grow
Freelancing & Client Work
29
Hosting & Deployment
40
Digital Marketing
32
SEO
26
Career Skills
34
CSS Dropdowns
Create a hoverable dropdown with CSS.
Demo: Dropdown Examples
CSS
HTML
Run
.dropdown { position: relative; display: inline-block; margin-right: 32px; } .dropbtn { background-color: #f97316; color: white; padding: 10px 16px; border: none; border-radius: 6px; cursor: pointer; font-size: 14px; } .dropdown-content { display: none; position: absolute; left: 0; top: 100%; margin-top: 8px; min-width: 150px; padding: 12px 16px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.15); background-color: #f9f9f9; border-radius: 6px; text-align: center; } .dropdown-content p { margin: 0; } .dropdown-content2 { text-align: left; } .dropdown-content2 a { display: block; color: #111; padding: 4px 0; text-decoration: none; } .dropdown-content2 a:hover { color: #f97316; } .dropdown:hover .dropdown-content { display: block; }
Previous
← P
CSS Navbar
N →
Next
CSS Form
30/49
Previous
Next
