در این مقاله می آموزید که چطور با استفاده از کد CSS، یک منو با قابلیت اسکرول کردن ایجاد کنید.
ساخت یک منو افقی با قابلیت اسکرول کردن
قدم اول : کد HTML را اضافه کنید.
منو افقی با قابلیت اسکرول
اندازه پنجره مرورگر را تغییر دهید تا تاثیر آن را ببینید
قدم دوم : کد CSS را اضافه کنید. نکته این مقاله، ایجاد یک نوار با قابلیت اسکرول کردن با استفاده از overflow: auto و white-space: nowrap است.
مثال :
مثال ساخت منو با قابلیت اسکرول :
body {
direction: rtl;
}
div.scrollmenu {
background-color: #333;
overflow: auto;
white-space: nowrap;
}div.scrollmenu a {
display: inline-block;
color: white;
text-align: center;
padding: 14px;
text-decoration: none;
}div.scrollmenu a:hover {
background-color: #777;
}