Home
Docs
Resources
Tools
Contact Us
বাংলা
Toggle Sidebar
Computer Basics
20
Graphic Design
17
Photoshop
12
Intro to Programming
19
Artificial Intelligence
23
HTML
35
CSS
35
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 Syllabus
JavaScript
28
React
25
PHP
29
SQL
16
WordPress
26
Python
29
Node.js
26
Hosting & Deployment
40
Digital Marketing
32
SEO
26
Career Skills
34
Office Skills
36
Figma
17
Freelancing & Client Work
29
UI/UX Design Principles
22
MongoDB
22
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/35
Previous
Next