طراحی با css

overcrash

Active Member
من یه جدول دارم که از چندتا سلول تشکیل شده و background سلولها به شکلی هست که کل جدول به شکل یه مستطیل با لبه های منحنی شده (اگه طراح باشید میفهمید چی میگم:wink: )
حالا من میخوام کل این حالت رو با css درست کنم (احتمالا بدون کدهای مربوط به جدول ) مثل کاری که سایتهای پیشرفته میکنند .
ممنون اگه کسی راهنمایی کنه
 

overcrash

Active Member
Ealireza50141 گفت:
خيلي ساده با Div و CSS
!
اااااااا من فکر میکردم با قاشق چنگال باید انجام بدم :eek:
منم گفتم با css میخوام انجام بدم ولی چجوری؟ کد میخوام :neutral:
یه کد که بدون نوشتن تگهای table یه همچین چیزی رو بسازه.
(فکر میکنم نوشتن یه همچین چیزی با css بهتر از table هست! درست میگم؟! )

اینم کدش:
HTML:
<table border="0" id="table59" cellpadding="0" style="border-collapse: collapse">
	<tr>
		<td height="34">
		<table border="0" width="100%" id="table60" cellpadding="0" style="border-collapse: collapse" height="100%">
			<tr>
				<td style="background-image: url('images/p-tl.gif')" width="35">&nbsp;</td>
				<td style="background-image: url('images/p-tc.gif'); background-repeat: repeat-x; background-position-y: top">
				<p align="center">&nbsp;</td>
				<td style="background-image: url('images/p-tr.gif')" width="35">&nbsp;</td>
			</tr>
		</table>
		</td>
	</tr>
	<tr>
		<td>
		<table border="0" width="100%" id="table61" cellpadding="0" height="0" style="border-collapse: collapse">
			<tr>
				<td width="6" style="background-image: url('images/p-cr.gif')">&nbsp;</td>
				<td>
				&nbsp;</td>
				<td style="background-image: url('images/p-cl.gif')" width="6">&nbsp;</td>
			</tr>
		</table>
		</td>
	</tr>
	<tr>
		<td height="34">
		<table border="0" width="100%" id="table63" cellpadding="0" style="border-collapse: collapse" height="100%">
			<tr>
				<td style="background-image: url('images/p-bl.gif')" width="35">&nbsp;</td>
				<td style="background-image: url('images/p-bc.gif'); background-repeat: repeat-x; background-position-y: bottom">
				&nbsp;</td>
				<td style="background-image: url('images/p-br.gif')" width="35">&nbsp;</td>
			</tr>
		</table>
		</td>
	</tr>
</table>
 
آخرین ویرایش:

Ali_ix

Well-Known Member
دوست عزیز شما باید اطلاعات پایه ای درباره Css و Html/xhtml داشته باشید.

با یک توضیح چند خطی چیزی متوجه نمیشید و کسی هم نمیتونه برای شما از 0 توضیح بده :)
 

overcrash

Active Member
دوست عزیز خیلی ممنون از توضیحات پایه ایتون
ولی من اطلاعات پایه از css رو دارم
فقط نحوه ساختن یه همچین جدولهایی رو میخوام بدونم
احتیاجی به توضیح کامل نیست :)
یه نمونه کد کوچیک کافیه!
 

Ali_ix

Well-Known Member
برای داشتن مستطیل های لبه گرد چندیت راه وجود داره که ساده ترین و انعطاف پذیر ترین راه اینه :
استفاده از عکس برای گوشه های گرد و قرار دادن عکسها به عنوان background بلاک مورد نظر.
که میتونید به ازای هر کودوم از گوشه های گردی که میخواید یک تگdiv با بک گراند عکس گوشه گرد داشته باشید.
و ا زdiv های تو در تو استفاده کنید.

الان لینک نمونه و توضیحاتش بیشترش دم دستم نیست. بعدا براتون میزارم
 

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
www.petefreitag.com/item/475.cfm

اینم لینک مستقیم به آموزشی که خواستی با چند تا مثال عالی در مورد همین موضوع:
http://pro.html.it/esempio/nifty/

یه سری به اینجا بزن 20 تا نکته جالب در مورد Css داره! نکته رو هم که می خواستی داره که میشه هم با عکس و هم بدون عکس گوشه ها رو گرد کرد
 
آخرین ویرایش:

emad7

Member
سلام
سی اس اس رو باید ور بری باهاش تا یاد بگیری کامل
 

جدیدترین ارسال ها

بالا