ریسپانسیو تیبل

E

erfaneh

تازه وارد
سلام

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

ممنون میشم راهنمایی کنید

 
M

mshomali

تازه وارد
سلام

برای ریسپانسیو کردن table نیازی به استفاده از @media نیست مانند قطعه کد زیر:

responsive table

<!DOCTYPE html>
<html>
<head>
<title>Responsive table</title>
</head>
<style>
table {
width: 100%;
border-collapse: collapse;
}
tr:nth-of-type(odd) {
background: #eee;
}
th {
background: #333;
color: white;
font-weight: bold;
}
td, th {
padding: 6px;
border: 1px solid #ccc;
text-align: left;
}
</style>
<body>
<table>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
</tr>
</thead>
<tbody>
<tr>
<td>James</td>
<td>Matman 19</td>
<td>Chief Sandwich Eater</td>
</tr>
<tr>
<td>The</td>
<td>Tick 20</td>
<td>Crimefighter Sorta</td>
</tr>
</tbody>
</table>
</body>
</html>


اگر قطعه کد بالا شما را متقاعد نکرد یا اشتباها منظور سوال شما را فهمیدم کد خود را اینجا ارسال کنید تا بنده و دوستان پاسخ دهیم.

با تشکر

 
آخرین ویرایش توسط مدیر:
شما برای پاسخ‌دادن باید به انجمن ورود کنید.
بالا