سوال: طراحی یک جدول در بوت استرپ [بایگانی]

ravand

سه شنبه 26 خرداد 1394, 19:42 عصر

شما این تصویر رو ببینید:
http://s6.picofile.com/file/8194031276/jadval.png
من موندم این جدول رو چطوری در نسخه ی مبایل بسازم؟ یعنی شکلش در نسخه ی مبایل چطوری باشه؟
در سایت خود بوت استرپ نگاه کردم دیدم چون در نسخه ی مبایل جاش نمیشد پایینش یه اسکرول انداخته بود. دقیقاً تصویرش همین بود:
132333
البته با تگ td ساخته بودن من میخوام با div بسازم.
الان به نظر شما من شکلش رو در نسخه ی مبایل چطوری در بیارم؟
متشکرم.

زینب فاطمی

سه شنبه 26 خرداد 1394, 21:17 عصر

سلام
اگر ساختارش جدول باشه و از کلاس table-responsive استفاده کنید فکر کنم درست بشه .

ravand

سه شنبه 26 خرداد 1394, 21:57 عصر

سلام
اگر ساختارش جدول باشه و از کلاس table-responsive استفاده کنید فکر کنم درست بشه .
بعید میدونم مشکلش حل بشه.
من نمیتونم از td استفاده کنم چون خواست مشتری div css هست.
من چیزی که شما گفتی رو امتحان کردم:
http://maxdesign.com.au/jobs/example-table/index1.htm
http://maxdesign.com.au/articles/simple-responsive-table/
اگه مرورگرتون رو کوچیک کنید می بینید که پایین جدول اسکرول میشه. مثل تصویری که براتون گذاشتم.
اگه درستش اینه که اسکرول بشه بگید تا من دیگه خیالم راحت باشه.
اگه اسکرول بشه باید یه عرض ثابت با پیکسل در نسخه ی مبایل بهش بدم و پایینشم اسکرول بندازم.

سعید کشاورز

سه شنبه 26 خرداد 1394, 22:46 عصر

من نمیتونم از td استفاده کنم چون خواست مشتری div css هست.
.
متاسفانه یه مشت آدم بی سواد میان از خودشون نظر میدن..یه جایی رفتن شنیدن Table به درد نمیخوره..اونوقت اگه شمایی که طراحی از Table استفاده کنی انگار جرم کردی:قهقهه:
از طرف من به اون آدمی که مشتریته بگو : از Table برای لایه بندی سایت استفاده نمیشه نه اینکه کلا Table رو خط بزنی

ravand

چهارشنبه 27 خرداد 1394, 06:56 صبح

متاسفانه یه مشت آدم بی سواد میان از خودشون نظر میدن..یه جایی رفتن شنیدن Table به درد نمیخوره..اونوقت اگه شمایی که طراحی از Table استفاده کنی انگار جرم کردی:قهقهه:
از طرف من به اون آدمی که مشتریته بگو : از Table برای لایه بندی سایت استفاده نمیشه نه اینکه کلا Table رو خط بزنی
ما از نظر شما بی سوادیم!!
والله ما چند ساله داریم میایم توی همین انجمن همه میگفتن td سرعت رو میاره پایین و از لحاظ سئو خوب نیست و ...
من خودم هم همیشه میگفتم از td در برخی جاها راحت تر و بهتر میشه استفاده کرد.
ولی معتقدم با div و css هم میشه این کارا رو کرد. چون خودم این کارا رو کردم.

محسن شامحمدی

چهارشنبه 27 خرداد 1394, 07:40 صبح

راوند جان.جناب
pro_man (http://barnamenevis.org/member.php?215381-pro_man)
کاملا درست می گن:
درسته که استفاده از جدول برای layout صفحه روش منسوخ شده ای هست (https://www.hotdesign.com/seybold/everything.html) ولی برای ساخت جداول تنها راه صحیح و درست استفاده از تگ جدول(table)هست
همینطور که می بینید تمام مثال های جدول بوت استرپ هم همه با تگ table هست
امیدوارم که بخاطر لجبازی با بقیه جدولتون رو با div طراحی نکنید :چشمک:

afshinz

چهارشنبه 27 خرداد 1394, 07:48 صبح

سلام دوست عزیز.
استفاده از جدول برای بخش بندی اصلی سایت از نظر سئو خوب نیست، چون محتوای داخل جداول ایندکس نمیشه و اگه شما ازش استفاده کنی کلا نمیشه سایت رو سئو کرد. مثلا نمیشه header,sidbar,footer رو دیگه داخل جدول بزاری. اما جدول کارایی خودش رو از دست نداده، اگه اینطوری بود کلا تو نسخه جدید منسوخ میشد. اگه داخل قالب جدول برای اطلاعات خاصی لازمه خب استفاده کنید.
فک کنم pro-man هم منظورش از بی سواد، مشتری شما بود. البته برداشت من از پستش اینجور بود.

ravand

چهارشنبه 27 خرداد 1394, 07:49 صبح

راوند جان.جناب
pro_man (http://barnamenevis.org/member.php?215381-pro_man)
کاملا درست می گن:
درسته که استفاده از جدول برای layout صفحه روش منسوخ شده ای هست (https://www.hotdesign.com/seybold/everything.html) ولی برای ساخت جداول تنها راه صحیح و درست استفاده از تگ جدول(table)هست
همینطور که می بینید تمام مثال های جدول بوت استرپ هم همه با تگ table هست
امیدوارم که بخاطر لجبازی با بقیه جدولتون رو با div طراحی نکنید :چشمک:
نه من ادم لج بازی نیستم. و ادم انتقاد پذیری هستم. من حرفی رو زدم که در طی این چند سال توی همین انجمن بهم زده شده.
من امدم یه امتحانی کردم و به این نتایج رسیدم:

div 4.00 KB (4,096 bytes)
li 4.00 KB (4,096 bytes)
tabel 4.00 KB (4,096 bytes)

همشون حجمشون یکی هست.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
.asli {
background-color: #e2d9f9;
width: 100px;
height: 100px;
text-align:center;
border: 1px solid #000000;
list-style-type:none;
}
.soto1{
width:48%;
height:100%;
border: 1px solid #ff0000;
}
.soto2{
width:48%;
height:100%;
border: 1px solid #2aea2a;
}
</style>
</script>
</head>
<body>
<table>
<tr>
<td class="soto1">متن اول</td>
<td class="soto2">متن دوم</td>
</tr>
</table>
</body>
</html>

div

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
.asli {
background-color: #e2d9f9;
width: 100px;
height: 100px;
text-align:center;
border: 1px solid #000000;
}
.soto1{
width:48%;
height:100%;
float:left;
border: 1px solid #ff0000;
}
.soto2{
width:48%;
height:100%;
float:right;
border: 1px solid #2aea2a;
}
</style>
</script>
</head>
<body>
<div class="asli">
<div class="soto1">متن اول</div>
<div class="soto2">متن دوم</div>
</div>
</body>
</html>

و حالا موندم چرا میگن td سرعتش پایینه. خب حجمشون یکی شد.

afshinz

چهارشنبه 27 خرداد 1394, 07:58 صبح

البته تو این مثال چون تعداد جداول کمه حجم کدها یکیه. ولی در کل تفاوت زیادی ندارن. اگر هم خیلی اصرار دارید به جای جدول از div استفاده کنید! میتونید از display: table استفاده کنید ولی هر چیزی رو برای کار خودش بهتره استفاده کرد

سعید کشاورز

چهارشنبه 27 خرداد 1394, 08:46 صبح

ما از نظر شما بی سوادیم!!
والله ما چند ساله داریم میایم توی همین انجمن همه میگفتن td سرعت رو میاره پایین و از لحاظ سئو خوب نیست و ...
من خودم هم همیشه میگفتم از td در برخی جاها راحت تر و بهتر میشه استفاده کرد.
ولی معتقدم با div و css هم میشه این کارا رو کرد. چون خودم این کارا رو کردم.
ravand جان منظور من شما نبودین که. :متعجب:..من هیچ موقع همچین جسارتی نمیکنم..منظور من مشتریتون بود که به شما گفته از table استفاده نکن..این مشتریا یه مشت آدم بی سواد هستن که الکی یه جا یه چیزی شنیدن که نباید از Table استفاده کرد..بعدش میان به شما دستور میدن که مثلا منم بلدم فکر نکنی میتونی سرم کلاه بزاری..
منظور من این بود..وگرنه من شمارو میشناسم.کارت درسته..

godofphp

پنج شنبه 28 خرداد 1394, 15:16 عصر

توی پروژه های کوچک که شاید چند جدول استفاده بشه فرقی نداره کار شما با table یا div css باشه
معمولا این بحث ها در پروژه های عظیم و بزرگ مورد بحث هست . مثلا توی یک برنامه تحت وب دائما تمام داده ها بصورت جدول باشه بهتره که div css استفاده شه تا تگ table اما توی پروژه های کوچک بخاطر راحتی بهتره که table استفاده کنی
How create table only using <div> tag and Css (http://stackoverflow.com/questions/3053205/how-create-table-only-using-div-tag-and-css):چشمک:

محسن شامحمدی

پنج شنبه 28 خرداد 1394, 23:00 عصر

جناب خدای پی اچ پی عزیز.
هیچ فرقی نداره
توی پروژه های بزرگ هم وضعیت همینه
حتی توی همون صفحه ای هم که لینک دادید اگر نظرات پایین تری رو می خوندید می دید که همه مخالفت کردن با اینکار

divs shouldn't be used for tabular data. That is just as wrong as using tables for layout.
Use a <table>. Its easy, semantically correct, and you'll be done in 5 minutes.

موتورهای جستجو اطلاعات حدولی رو توی تگ table خیلی راحت تر می خونن.
حتی همین مثالی هم که از استک آوردید ساختار html ای مشابه table می سازه

<body>
<form id="form1">
<div class="div-table">
<div class="div-table-row">
<div class="div-table-col" align="center">Customer ID</div>
<div class="div-table-col">Customer Name</div>
<div class="div-table-col">Customer Address</div>
</div>
<div class="div-table-row">
<div class="div-table-col">001</div>
<div class="div-table-col">002</div>
<div class="div-table-col">003</div>
</div>
<div class="div-table-row">
<div class="div-table-col">xxx</div>
<div class="div-table-col">yyy</div>
<div class="div-table-col">www</div>
</div>
<div class="divRow">
<div class="div-table-col">ttt</div>
<div class="div-table-col">uuu</div>
<div class="div-table-col">Mkkk</div>
</div>

</div>
</form>
</body>

برای نمایش اطلاعات جدولی شکل همیشه باید از تگ table استفاده بشه.
باور ندارید نظر بچه های stack رو ببینید.
Should I use DIV or TABLE? (http://stackoverflow.com/questions/16482093/should-i-use-div-or-table)
Divs vs tables for tabular data (http://stackoverflow.com/questions/6637629/divs-vs-tables-for-tabular-data)

afshinz

جمعه 29 خرداد 1394, 00:42 صبح

توی پروژه های کوچک که شاید چند جدول استفاده بشه فرقی نداره کار شما با table یا div css باشه
معمولا این بحث ها در پروژه های عظیم و بزرگ مورد بحث هست . مثلا توی یک برنامه تحت وب دائما تمام داده ها بصورت جدول باشه بهتره که div css استفاده شه تا تگ table اما توی پروژه های کوچک بخاطر راحتی بهتره که table استفاده کنی
How create table only using <div> tag and Css (http://stackoverflow.com/questions/3053205/how-create-table-only-using-div-tag-and-css)

:چشمک:
سلام.
ببخشید میشه دقیقا بگید فرقش چیه که تو پروژه های بزرگ باید از div به جای table استفاده کرد؟؟!!!
اگه میشه 1 نمونه رو لینک بدید.واقعا ممنون میشم.
آخه تگی که کارش ساخت جدول هست رو تعریف کردن مگه طراح بیکاره که بیاد جدول شبیه سازی کنه. اون قضیه جدول هم فقط برای بخش بندی اصلی مشکه و بس. اگه چیز جدیدی اعلام شده خب بگید مام مطلع شیم.

white tower

جمعه 29 خرداد 1394, 23:37 عصر

چند سال پیش من همین بحث رو با صاحب همین سایت تو یه بخش دیگه کردم(اون موقع مدیر بخش بود).هرچی من گفتم بابا جان بعضی جاها هست که بهتره از table استفاده بشه نفهمید که نفهمید.همین نفهم الان مدرس وب هم هست.چند تا شاگرد هم میده بیرون نفهم تر از خودش.
استفاده از جدول در layout خداییش کار مزخرفیه ولی جاهایی هست که اصلا جدول از پایه هم برای همین ساخته شده.جدولی که ریسپانسیو بشه که دیگه جدول نیست.یعنی شما کاری کنی که ستون ها زیر هم بیافتن.تا جاییکه میشه سعی کنید بدون اسکرول نمایشش بدید ولی اگر نشد باید اسکرول افقی بشه.