با یکی دیگر از جلسات دوره رایگان آموزش HTML و CSS با عنوان تگ table در HTML و آموزش ساخت جدول در HTML و css در خدمت شما عزیزان هستیم، در این آموزش میخواهیم نحوه ساخت جداول در صفحات وب را آموزش دهیم، بهتر است بدانید که بخشهای زیادی از صفحات وب را جدولها تشکیل میدهند، بنابراین خوب است تگ table که وظیفه ساخت جدول در html دارد را به خوبی یاد بگیرید، پس تا انتهای این آموزش همراه آکادمی وبکیما باشید.
کدهای html ساخت جدول
<!DOCTYPE html>
<html lang="fa-IR">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>کار با جدولها</title>
</head>
<body>
<table>
<tr>
<th>نام</th>
<th>نام خانوادگی</th>
<th>سن</th>
<th colspan="2">شماره تماس</th>
</tr>
<tr>
<td>نبـــی</td>
<td>عبدی</td>
<td rowspan="2">29</td>
<td>0912222232</td>
</tr>
<tr>
<td>مجید</td>
<td>کامرانی</td>
<td>25</td>
<td>0935564645</td>
</tr>
</table>
</body>
</html>
کدهای css ساخت جدول
table, td, th {
border: 1px solid #90a4ae;
padding: 5px;
border-collapse: collapse;
}
td, th {
width: 100px;
text-align: center;
}
جمع بندی
در انتها امیدواریم که با مشاهده آموزش ساخت جدول و کار با تگ table در HTML، نحوه ساخت جداول در html را به خوبی یاد گرفته باشید، هر گونه مشکل و سوالی در رابطه با این جلسه دارید، در قسمت نظرات همین مطلب مطرح کنید تا پاسخ سوالات شما را در کمترین زمان بدهیم. با تشکر از همراهی شما.
یه عکس و پاراگراف رو کنار هم در یک سطر قرار دادن برای این کار رسم جدول پیشنهاد میشه یا راه بهتری هست؟ الان برای تنظیم سایز عکس و.. کدهای width و.. به خوبی تراز نمی کنه راهش چیه؟
آموزشها را دنبال کنید، تا اینجا فقط مباحث بسیار مقدماتی آموزش داده شده است، دنیای html css بسیار بزرگ تر از آن چیزی است که فکر میکنید، برای انجام هر کاری در این دنیا ده ها راه مختلف وجود دارد.
سلام چطوری عرض و ارتفاع جدول رو دستی تنظیم کنیم؟ مثلا عرض یک ستون 60% یکی 40% ؟ کال اسپن مخفف چیه؟
سلام، این سوال شما در ویدیوهای بعدی پاسخ داده می شود. (ویدیوهای پروژه محور)