من می خوام با تگ های div چهار ستون توی صفحه ایجاد کنم

idocs · Dec 16, 2010

من می خوام با تگ های div چهار ستون توی صفحه ایجاد کنم بطوری که عرض هر ستون 100 پیکسل باشه و هر چهار ستون توی یه خط باشن.

همچنین می خوام توی مرورگرهای مختلف از جمله IE6 بدون مشکل اجرا بشن.

alionline1366 · Dec 16, 2010

HTML:

<style>
	#container {width:500px;margin:0 auto;}
	#box1,#box2,#box3,#box4 {width:100px;margin-left:10px;float:right;border: 1px solid #ddd;}
</style>
</head>
<body>
<div id="container">
	<div id="box1">
sfsdf
	</div>
	<div id="box2">
cvb
	</div>
	<div id="box3">
mn,
	</div>
	<div id="box4">
yuiyu
	</div>
</div>

idocs · Dec 16, 2010

alionline1366 گفت:

HTML:

<style>
    #container {width:500px;margin:0 auto;}
    #box1,#box2,#box3,#box4 {width:100px;margin-left:10px;float:right;border: 1px solid #ddd;}
</style>
</head>
<body>
<div id="container">
    <div id="box1">
sfsdf
    </div>
    <div id="box2">
cvb
    </div>
    <div id="box3">
mn,
    </div>
    <div id="box4">
yuiyu
    </div>
</div>

منون از راهنماییتون. می تونید به این کد که نوشتید قسمت فوتر اضافه کنید و کد رو طوری تغییر بدید که اگر ارتفاع محتویات سایت از ارتفاع مانیتور کمتر بود، فوتر به انتهای مانیتور بچسبه و اگر محتویات صفحه ارتفاعی بیشتر از ارتفاع مانیتور داشتن، فوتر در انتهای محتویات سایت قرار بگیره؟

salim_a · Dec 17, 2010

دوست عزیز

من می خوام داشته باشم 3 ستون دو بغل 200 وسط 450

چه کار کنم ؟ کد رو که نشونم درسته .

کد:

    #container {width:850px;margin:0 auto;}

می خوام واسه ستون قسمت راست ( منوهای اصلی : ( که شامل : صحفه ی اصلی و تماس با ما و ......)
( آرشیو )
قسمت چپ ( نظر سنجی و .....

رو بزارم

ممنون میشم کمک کنید

alionline1366 · Dec 17, 2010

idocs گفت:
منون از راهنماییتون. می تونید به این کد که نوشتید قسمت فوتر اضافه کنید و کد رو طوری تغییر بدید که اگر ارتفاع محتویات سایت از ارتفاع مانیتور کمتر بود، فوتر به انتهای مانیتور بچسبه و اگر محتویات صفحه ارتفاعی بیشتر از ارتفاع مانیتور داشتن، فوتر در انتهای محتویات سایت قرار بگیره؟

HTML:

<style>
	#container {width:438px;margin:0 auto;}
    	#box1,#box2,#box3 {width:100px;margin-left:10px;float:right;border: 1px solid #ddd;}
	#box4 {width:100px;margin:0px;float:right;border: 1px solid #ddd;}
    	#footer {width:436px;margin:10px auto 0;border:1px solid #ddd}
</style>
</head>
<body>
<div id="container">
    <div id="box1">
	sfsdf
    </div>
    <div id="box2">
	cvb
    </div>
    <div id="box3">
	mn,
    </div>
    <div id="box4">
	yuiyu
    </div>
</div>
<div style="clear:both"></div>
<div id="footer">
	sdhjkhsdkjhjksghjkdfsg
</div>

اون قضیه ارتفاع رو باید پیش فرض ست کنید به صورت عادی نمیشه اینکارو کرد یعنی میشه ولی باید براش با جاوا اسکریپت کد نوشت که اول اندازه بروزر طرف رو چک کنه مثلا اگر 1024x768 بود یک استایل رو نشون بده وگر نه یک استایل دیگه

alionline1366 · Dec 17, 2010

salim_a گفت:
دوست عزیز

من می خوام داشته باشم 3 ستون دو بغل 200 وسط 450

چه کار کنم ؟ کد رو که نشونم درسته .

کد:

#container {width:850px;margin:0 auto;}

می خوام واسه ستون قسمت راست ( منوهای اصلی : ( که شامل : صحفه ی اصلی و تماس با ما و ......)
( آرشیو )
قسمت چپ ( نظر سنجی و .....

رو بزارم

ممنون میشم کمک کنید

HTML:

<style>
	#container {width:876px;margin:0 auto;}
    	#box1 {width:200px;margin-left:10px;float:right;direction:rtl;text-align:right;}               
	#box2 {width:450px;margin-left:10px;float:right;direction:rtl;text-align:right;}
	#box3 {width:200px;margin:0px;float:right;direction:rtl;text-align:right;}
               .sidebox {border:1px solid #ddd;margin-bottom:10px;padding:5px;}
	.mainbox {border:1px solid #ddd;margin-bottom:10px;padding:5px;}
    	#footer {width:864px;margin:10px auto 0;border:1px solid #ddd;padding:5px;}
</style>
</head>
<body>
<div id="container">
    <div id="box1">
	<div class="sidebox">
		<ul>
			<li><a href="#">صفحه اصلی</a></li>
			<li><a href="#">تماس با ما</a></li>
			<li><a href="#">مدیریت</a></li>
		</ul>
               </div>
	<div class="sidebox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
	<div class="sidebox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
    </div>
    <div id="box2">
	<div class="mainbox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
    </div>
    <div id="box3">
	<div class="sidebox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
	<div class="sidebox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
    </div>
</div>
<div style="clear:both"></div>
<div id="footer">
	sdhjkhsdkjhjksghjkdfsg
</div>

salim_a · Dec 17, 2010

ممنون دوست عزیز

راستی توی سی اس اس ----- ul ,li همون کار تی دی - و تی آر html رو انجام میدن ؟
یه سوال دیگه دارم

کد:

<div id="box1">
	<div class="sidebox">
		<ul>
			<li><a href="#">صفحه اصلی</a></li>
			<li><a href="#">تماس با ما</a></li>
			<li><a href="#">مدیریت</a></li>
		</ul>
               </div>
	<div class="sidebox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
	<div class="sidebox">
		sdjhjksdfhgjhjfg</br>sdfjhsgdfhg
               </div>
    </div>

من می خوام واسه این لینک ها عنوان بزارم --- به نام منوی اصلی بولد هم باشه

می خوام بدونم 200 -450 -200 چرا شده

کد:

#container {width:876px;margin:0 auto;}

خودتون بیشتر می گیرید یا فرمول خاصی داره ؟

salim_a · Dec 17, 2010

دوست عزیز

اگه فایل پیوست رو بیبینی یه عکس هست که من می خوام بزارمش توی box2

میشه عکس رو بگیرم بک گراند و بدش با مارگین رایت ( اگه تایپم درست باشه ) گزینه های رو بنویسم مثل : صحفه ی اصلی و ...

اما این کار باعث میشه سایت کمی دیر بالا بیاد

می خوام یه عکس رو به 8 تیکه کنم ( پیوست رو بیبینی معلوم میشه ) در اندازه 19*19 برای این کار بیاد box2 رو ویرایش کنم یا یه box2-1 اضافه کنیم .

ممنون میشم در این خصوص توضیحاتو بدی لطفا کد ش رو هم بنویس

با تشکر

echessdesign · Dec 18, 2010

درود بر شما
ممنون از توضیحات خوب علی
من تعجب می کنم که حتی باز کننده تایپیک، سوال خودش رو در انجمن جستجو نکرده!
مفصل در این رابطه توضیح داده شده است