ورود

نسخه کامل مشاهده نسخه کامل : سوال در مورد table های اچ تی ام ال



diana_1989
04-05-2012, 18:04
سلام دوستان
میخوام با زبان html یه جدول مثه شکل زیر درست کنم
[ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ]
کدی که نوشتم اینه :

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

اما مثه شکلی که میخوام نمیشه . در واقع میخوام اندازه ستون های سطر دو کوچیک بزرگ باشه ک این امکان با برچسب <td> نیس باید چیکار کنم ؟

neopersia
04-05-2012, 19:21
سلام

برای سلول جدول هم میشه از width استفاده کرد.
البته اگر از این کد برای چیدمان صفحه استفاده میکنید از پایه اشتباهه!


برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

diana_1989
04-05-2012, 20:55
برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

ممنون از لطفتون . خودمم متوجه شدم ک این کدی ک نوشتم درست نیس . چون وقتی میخواستم لینک بدم اشتباه میشد
این کد اصلیه ک نوشتم واسه شکل بالا
اما چند تا اشکال داره و اونم اینه ک تیبل اول حاشیه اش دیده نمیشه . من میخوام فقط بین لینک ها بوردرش دیده نشه .مسلما وقتی از مشخصه border استفاده نمیکنم کلا هیچی دیده نمیشه . راه حلش چیه ؟
دوما برای جدول پایینی با اینکه طول و عرضشو مشخص میکنم کوچیک دیده میشه ارتفاعش . همچنین وقتی تو تگ img عکس میذارم متناسب با عکس تغییر سایز میده سلولش . باید چیکار کنم ؟

m.m.m5651
04-05-2012, 21:36
دوما برای جدول پایینی با اینکه طول و عرضشو مشخص میکنم کوچیک دیده میشه ارتفاعش . همچنین وقتی تو تگ img عکس میذارم متناسب با عکس تغییر سایز میده سلولش . باید چیکار کنم ؟

در مورد دومی بگم که:
باید با style، بهش max-width بدید.

diana_1989
04-05-2012, 23:53
در مورد دومی بگم که:
باید با style، بهش max-width بدید.

متوجه منظورتون نشدم :41:

diana_1989
07-05-2012, 21:59
کسی کمک نمیکنه ؟ ؟ ؟:41:

mohrd
07-05-2012, 23:23
سلام.
بهتره از styleها استفاده کنید. راحت تره و نتیجه هم زیباتر خواهد بود:

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید
استایل table-layout: fixed تعیین میکنه که اندازه ی سلول ها از چیزی که شما تنظیم کرده اید پیروی کنه و متناسب با محتوا تغییر نکنه (البته یکی از خواص مهم table همین متغیر بودن بر اساس محتواست. اگر قراره که fix باشه، میتونید از سایر تگ ها مثل div استفاده کنید)
و overflow: hidden هم میگه که محتوایی که بزرگتر از طول/عرض تعیین شده هست رو نمایش نده. عملاً با این استایل مرورگر محتوای اضافه رو کات میکنه.

اون border ها هم فکر نمیکنم نیاز به توضیح داشته باشه. اگر مشکلی داشتید بفرمایید.
در مورد cellspacing هم باید بگم که این مشخصه مربوط به فاصله ی سلول ها در جدول هست. که عملاً نقش استایل margin رو بازی میکنه (و میتونید به جای اون از margin برای td ها استفاده کنید)
در ادامه ی توضیح بالا، باید بگم که اکثر مشخصه هایی که ما برای table تعریف میکنیم (مثل cellpadding و cellspacing و border) روی td ها و th ها (مربوط به heading جدول) تاثیر میگذارند..

سؤالی بود بفرمایید.
موفق باشید ./.

diana_1989
07-05-2012, 23:55
ممنون از لطفتون اما متوجه این قسمت ها نشدم ... همیشه تو style باید از کلاس بندی استفاده کرد؟ یعنی اول کلاسا رو تعریف کنیم بعد تو تیبل ها ازش استفاده کنیم ؟
این قسمت از کد رو هم متتوجه نمیشم اندازه هاشو :


برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

و چرا در تیبل 2 از بوردلفت استفاده شد :

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

فرمودین cellspacing مربوط به فاصله ی سلولهاس . یعنی حالا ک 0 در نظر گرفتین فاصله ای نمیفته ؟

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

mohrd
09-05-2012, 20:14
ممنون از لطفتون اما متوجه این قسمت ها نشدم ... همیشه تو style باید از کلاس بندی استفاده کرد؟ یعنی اول کلاسا رو تعریف کنیم بعد تو تیبل ها ازش استفاده کنیم ؟
این قسمت از کد رو هم متتوجه نمیشم اندازه هاشو :


برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

و چرا در تیبل 2 از بوردلفت استفاده شد :

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

فرمودین cellspacing مربوط به فاصله ی سلولهاس . یعنی حالا ک 0 در نظر گرفتین فاصله ای نمیفته ؟

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید
سلام.
خیر. میشه همون استایل ها رو در style هم تعریف کرد. اما اگر 2 المنت داشته باشید که استایل های مشابهی داشته باشند، باید همه ی استایل ها رو در style تعریف کنید که کار نسبتاً اضافه ای حساب میشه. و بهتره یک کلاس تعریف کنید و به اون المنت ها بدید.

در:

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید
این کد border به صورت خلاصه هست. در اصل باید از border-style، border-width، border-color و ... استفاده کرد. البته روش خلاصه بهتره. پارامتر اول ضخامت کادر هست، دومی استایلش و سومی رنگش.

برای اینکه در تیبل 2، ما اومدیم و بردر پیشفرض تیبل رو 0 کردیم. و به td ها بردر دادیم. چون بردر سمت چپ اضافه بود (2 تا td کنار هم، عملاً خط بینشون 2 برابر میشد) اومدیم و گفتیم که بردر چپ نداشته باشه. که این مشکل پیش نیاد.
اما به دلیل اینکه با اینکار، آخرین td هم بردر چپ نداره، و در نتیجه کل جدول هم بردر چپ نداره، اومدیم و به خود جدول (table) یک بردر چپ دادیم.

خیر. با cellspacing="0" ما فاصله ی پیشفرض جدول رو صفر کردیم. و به جای اون، از margin در td ها استفاده کردیم....

موفق باشید ./.