تبدیل افقی به عمودی و عمودی به افقی چند لینک

benyamin_pc · Mar 31, 2013

سلام دوستان
چنتا لینکو که به شکل افقی پشت سر هم ایجادشون کردیمو بخایم عمودی زیر هم بشن راه چیست؟
حالا اگه چنتا لینکو عمودی زیر هم ایجاد کرده باشیمو بخایم افقی پپشت سر هم بشن راه چیست؟
فقط ایجاد این لینک ها با div های جداگونه هست و دور تا دورش متن هست و کله این لینکا هم تو یه div هستن

3d mostafa · Apr 1, 2013

میشه یه نمونه کد بذاری بعد درموردش دقیق تر توضیح بدی ؟ من که نگرفتم دقیق میخای چیکار کنی !! خب وقتی لینکارو به صورت عمودی و افقی میتونی درست کنی خب مسلما برعکسشم میتونی دیگه !!!!
یه نمونه کد بذار تا راحت تر بشه نظر داد

benyamin_pc · Apr 1, 2013

نمونش مثل منوهای افقی یا عمودی که موجود هستند و توسط اسکریپت با ul و li اشناسائی میشن

3d mostafa · Apr 1, 2013

خب برای دو ستونه کردن یا بیش تر یه تو یه تگ li که برای منوی اصلیه دوتا یا بیشتر تگ ul میذاری و به اینا خاصیت float میدی که پشت سرهم افقی میشن . برای این که li های ul آخری هم عمودی بشن clear:both رو بهش بدی درست میشه این یه کد خیلی ساده ست چون وقت نداشتم کاملش کنم دیگه ببخشید !!بقیش پای خودت !!!

[HTMLS]<!DOCTYPE>
<html>
<head>
<title>drop menu</title>
</head>
<body>

<div id="nav">
<ul class="menu">
<li><a href="#">شماره 1 </a>
<div class="move-submenu">
<ul class="col1">
<li><a href="#">شماره5 </a></li>
<li><a href="#">شماره6 </a></li>
<li><a href="#">شماره7</a></li>
</ul>
<ul class="col2">
<li><a href="#">شماره8</a></li>
<li><a href="#">شماره9</a></li>
<li><a href="#">شماره10</a></li>
</ul>
</div>
</li>
<li><a href="#">شماره 2 </a></li>
<li><a href="#">شماره 3 </a></li>
<li><a href="#">شماره 4 </a></li>
</ul>
</div>
</body>
</html>[/HTMLS]

اینم کد css
[CSSS]body,div,ul,li,a {padding:0px;margin:0px;}
#nav {
background:gray;
margin:0 auto;
width:800px;
height:40px;
margin-top:10%;
position:relative;
}
ul.menu {
position:relative;
}
ul.menu li {
float:left;
margin:10px;
}
ul.menu li ul {
float:left;
}
ul.menu li ul li {
clear:both;
float:left;
}[/CSSS]