نتیجه
امتحان کنید
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> body { direction: rtl; } .vertical-menu { width: 200px; } .vertical-menu a { background-color: #eee; color: black; display: block; padding: 12px; text-decoration: none; } .vertical-menu a:hover { background-color: #ccc; } .vertical-menu a.active { background-color: #4CAF50; color: white; } </style> </head> <body> <h1>منو عمودی</h1> <div class="vertical-menu"> <a href="#" class="active">خانه</a> <a href="#">لینک 1</a> <a href="#">لینک 2</a> <a href="#">لینک 3</a> <a href="#">لینک 4</a> </div> </body> </html>
امتحان کنید