با سلام دوباره.به همین زودی شش قسمت از این خودآموز آماده شد و در اختیار شما دوستان عزیز قرار گرفت .امیدوارم که تا به اینجا این خودآموز مورد توجه شما قرار گرفته باشه.
قبل از شروع این قسمت نکته قابل ذکر و مهم رو یاد آوری میکنم:
یکی از بهترین راهها برای یادگیری بهتر تمرینه.پس قسمت های قبلی رو فراموش نکنید و سعی کنید اونها رو مرور کنید.
سوم اینکه در قسمتهای آینده در نظر دارم به صورت Work Shop و یا به قول خودمون به صورت عملی آموزش ساختن یک وب سایت رو از ابتدا شروع کنم.
Table ها
همیشه برای ساختن هر سازه ای احتیاج به یک استخوانبندی وجود دارد. این موضوع در مورد یک صفحه وب نیز صادق است و برای ساختن یک صفحه وب ( با توجه به ایده ما برای طراحی ظاهر آن صفحه ) احتیاج به یک ساختار کلی است که در اکثر موارد از دید کاربران و باز دیدکنندگان صفحات وب مخفی می ماند.
این ساختار کلی در اکثریت موارد به وسیله table ها و در طراحی مدرن به وسیله تگ های div (که کاربرد بسیار زیادی در طراحی و ساخت صفحات وب دارد) صورت می گیرد.
در اینجا به table ها می پردازیم و در قسمتهای آینده به صورت مفصل به تگهای div خواهیم پرداخت.
Table ها به وسیله تگ به مرورگرها معرفی میشوند و دارای ستون وسطر هستند.
ستون ها به وسیله تگهای و سترها به وسیله تگهای مشخص میشوند.لازم به ذکر است که تگهای و به تنهایی کاربردی ندارند و لزوما باید همراه تگ در کدها قرار بگیرند.
در زیر نمونه ای از یک table با یک ستون و یک سطر می بینید.
@@
@@
به نحوه باز شدن وبسته شدن تگها توجه کنید ( قانون تگهای باز و بسته – قسمت اول آموزش html )
این table می تواند تعداد دلخواهی ستون وسطر داشته باشد و محدودیت از این نظر وجود ندارد.
برای اینکه بتوانیم کنترل بیشتری بر روی ظاهر این جدول ها داشته باشیم می توانیم از خصوصیت های این جدول ها استفاده کنیم.
طول و عرض table ها
دو خصوصیت width و height این توانایی را به ما میدهد که طول و ارتفاع این جدولها را تععین کنیم.
این طول و عرض می توانند به صورت وابسته و یا ثابت باشند.در حالت وابسته طول و عرض با درصدی از عرض کل صفحه مشخص می شود و در اندازه گذاری ثابت مقداربه صورت ثابت به جدولها و سلولها داده می شود.
@@
@@
این جدول دارای دو ستون و یک سطر با ارتفاع و عرض ۲۰۰ پیکسل است.
@@
@@
صوصیت Border
مرز بین این سطر ها وستونها با استفاده از خطوط (border ) مشخص میشود که میتوان با استفاده از این خصوصیت آن را کنترل کرد.
__
__
مقدار خصوصیت border نشان دهنده ضخامت آن است ) واحد پیکسل ( و در صورتی که مقدار آن صفر باشد ( border=”۰” ) هیچ border نمایش داده نمیشود .
Align و یا چینش در سطرها و ستون ها
هر سطر و یا ستون در یک جدول می تواند چینش مختص به خود را داشته باشد یعنی عناصر داخل آن سطر و یا ستون از چینش آن سطر و یا ستون پیروی میکنند.
به طور مثال :
@@
ستون اول – سطر اول
ستون دوم – سطر اول
ستون اول – سطر دوم
ستون دوم – سطر دوم
@@
در این مثال جدول از دو سطر و دو ستون تشکیل شده است که در مثال مشخص شده است.
کلیه سطر ها وستون ها از چینشی که به تگ table در ابتدای مثال داده شده است پیروی میکنند و چینش همه سطرها و ستونها center است .
میتوان به هر یک از سطرها و ستونها نیز به تنهایی چینش و align داد به مثال زیر توجه کنید:
@@
ستون اول – سطر اول
ستون دوم – سطر اول
ستون اول – سطر دوم
ستون دوم – سطر دوم
@@
در مثالها ملاحضه میکنید که نوشته هایی که در بین تگهای نوشته شده اند در آن سلول نمایش داده میشوند و در صورتی که هیچ عنصری در بین این تگها نباشد سلول به صورت خالی نمایش داده می شود.
عناصر کوچکتر تشکیل دهنده هر جدول را سلول می نامیم.در مثال بالا جدول دارای چهار سلول است.
Table های تو در تو
یکی دیگر از خصوصیات این جداول قابلیت تو در تو قرار گرفتن این جداول است به این معنی که یک جدول می تواند در داخل سلول یک جدول دیگر قرار گیرد و زیر مجموعه جدول بالاتر از خود باشد .به مثالی در این مورد توجه کنید :
@@
ستون اول – سطر اول
ستون اول – سطر اول
ستون دوم – سطر اول
ستون اول – سطر دوم
ستون دوم – سطر دوم
ستون اول – سطر دوم
ستون دوم – سطر دوم
@@
در این مثال ملاحظه می کنید که یک جدول با ۲ سطر و ستون داخل یکی از سلولهای جدول بالاتری خود با ۲ سطر و ستون قرار گرفته این قابلیت کمک بسیاری به طراحان صفحات وب در چینش این صفحات می کند.
Background color ( رنگ پس زمینه )
هر جدول و یا هر سلول و یا هر سطر و یا ستون می تواند دارای رنگ پس زمینه مختص به خود باشد.به مثال زیر توجه کنید:
__
ستون اول – سطر اول
ستون دوم – سطر اول
ستون اول – سطر دوم
ستون دوم – سطر دوم
__
ملاحضه مینمایید که رنگ پس زمینه جدول به رنگ قرمز است ولی رنگ سلول ستون اول – سطر اول به رننگ آبی است و چون خودش دارای رنگ پس زمینه است از رنگ پس زمینه کل جدول پیروی نمی کند.
Table ها دارای خصوصیات بسیاری هستند که در طول تمرین با آنها آشنا خواهید شد و آنها را تجربه می کنید.
امتیاز: 0.00
وزارت آموزش و پرورش > سازمان پژوهش و برنامه‌ريزی آموزشی
شبکه ملی مدارس ایران رشد
ارسال ها: 1679
شما باید یک عنوان و متن وارد کنید!