HTMLکه مخفف عبارت Hyper Text Markup Language می باشد، د

Download Report

Transcript HTMLکه مخفف عبارت Hyper Text Markup Language می باشد، د

‫‪HTML‬که مخفف عبارت ‪ Hyper Text Markup Language‬می باشد‪ ،‬در‬
‫واقع زبان مرورگرهای وب است‪.‬‬
‫تاریخچه ‪:HTML‬‬
‫اقای تیم برنرز لی در سال ‪ 1989‬شبکه جهانی وب را طرح ریزی کرد‪ .‬در واقع هدف اصلی وی فراهم اوردن ساز و کاری بود که از ان طریق محقیق‬
‫بتوانند نتایج تحقیقات خود را با یکدیگر به اشتراک بگذارند‪ .‬سپسزبان نشانه گذاری فرامتنی یا ‪Hypertext Markup‬‬
‫‪Language‬که به صورت مختصر ‪HTML‬خوانده می شود را طرح ریزی نمود و در نهایت در سال ‪ 1991‬این زبان به طور رسمی به دنیا‬
‫معرفی شد و این زبان به جای ی رسید که دنیای اینترنت بدون ان بی معنا است‪.‬‬
‫*************************************************‬
‫عبارت ‪Hyper‬در مقابل عبارت ‪Linear‬قرار دارد‪ .‬منظور از ‪Linear‬ساختاری "خطی" است‪ .‬به عبارت دیگر فرض کنیم یک زبان برنامه‬
‫نویسی است که ساختاری خطی دارد و در ان کارها یکی پس از دیگری انجام می شوند‪ .‬فرض کنیم دو دستور داریم‪ :‬دستور الف و دستور ب‪ .‬حال‬
‫مادامیکه دستور الف انجام نشده باشد قادر نخواهیم بود دستور ب را اجرا کنیم‪ .‬اما قضیه در مورد زبان اچ تی ام ال که یک زبان ‪Hyper‬است‬
‫فرق می کند به این شکل که در هر کجای وب و در هر زمانی که باشیم می توانیم به بخش دیگری رفته و به هیچ وجه نیاز نیست تا دستورات یکی‬
‫پس از دیگری انجام شوند‪ .‬به طور مثال ً‬
‫اصال نیازی نیست تا اول به سایت گوگل رفته سپس وارد سایت یاهو شویم (الزم به ذکر است که معنی‬
‫لغوی ‪Hyper‬عبارت است از ماوراء‪ ،‬فوق‪ ،‬باال و ‪.)...‬‬
‫کلمه ‪Text‬که گویا است و به معنی "متن" است‪ .‬به طور کلی ‪Hypertext‬به منزله متنی است که با کلیک روی ان می توان به صفحه دیگری‬
‫رفت‪.‬‬
‫منظور از ‪Language Markup‬زبانی است که در ان‪ ،‬متن کاری بیش از قرار گرفتن روی صفحه مروگر انجام می دهد و از سوی دیگر به جای‬
‫متون می توان از تصاویر‪ ،‬لینک ها‪ ،‬جداول‪ ،‬منوها و ‪ ...‬استفاده کرد‪.‬‬
‫همانطور که پیش از این توضیح داده شد زبان اچ تی ام ال یک زبان ‪Markup‬است‪ .‬به عبارت دیگر برخالف زبان های ‪Scripting‬یا‬
‫‪Programming‬که برای انجام کارهای مختلف از دستورات خاصی استفاده می کنند‪ ،‬زبان اچ تی ام ال از تگ ها برای انجام کارهای خود‬
‫استفاده می کنند (منظور از زبان ‪Scripting‬زبانی است که اپلیکیشن های نوشته شده با ان فقط در صورت مشاهده یک درخواست کاری را‬
‫انجام می دهد اما یک زبان ‪Programming‬زبانی است که برنامه های نوشته شده با ان بدون نیاز به دریافت درخواست از طرف کاربر هم‬
‫می توانند دستوری را اجرا کنند)‪.‬‬
‫*****************************************‬
‫به طور کلی زبان اچ تی ام ال زبان قابل فهم برای کلیه مرورگرها است‪ .‬در حقیقت مرورگر کدهای اچ تی ام ال را تفسیر نموده و به متونی تبدیل می کند که‬
‫برای کاربر قابل مشاهده باشند‪.‬‬
‫پس از معرفی اولین نسخه این زبان‪ ،‬در هر نسخه جدید قابلیت های فراوانی به این زبان اضافه شد بطوریکه سیر پیشرفت این زبان در جدول زیر نشان داده شده است‪:‬‬
‫همانطور که در جدول باال مشاهده می شود نسخه ای تحت عنوان ‪XHTML 1.0‬و ‪XHTML5‬در لیست دیده می شوند‪ .‬سازمانی به ادرس‬
‫‪ www.w3c.com‬متولی ارتقاء و انتشار زبان اچ تی ام ال است ً‬
‫تقریبا در سال ‪ 2000‬نسخه جدیدی از زبان اچ تی ام ال را تحت عنوان اکس اچ‬
‫تی ام ال را را منتشر کرد ( الزم به ذکر است که ‪w3c‬مخفف ‪World Wide Web Consortium‬به معنی کنسرسیوم شبکه جهانی‬
‫وب می باشد)‪.‬‬
‫به طور کلی منظور از اکس اچ تی ام ال ترکیبی از زبان اچ تی ام ال با زبان اکس ام ال است‪ .‬در واقع پس از ترکیب دو زبان با یکدیگر زبان اچ تی ام ال‬
‫توسعه پذیر تر شد و به طور کلی دست برنامه نویسان به مراتب باز تر شد‪ .‬در نسخه اول این زبان کلیه تگ ها شبیه به تگ های نسخه اچ تی ام ال ‪ 4‬بود‬
‫با این تفاوت که یکسری تگ های تکمیلی به ان اضافه شده و یکسری قوانینی هم به ان اضافه شده است که می شود گ فت قوانین سخت گیرانه ای بودند‪.‬‬
‫همانطور که در جدول باال مشخص است‪ ،‬اخرین نسخه از زبان اچ تی ام ال نسخه ‪ 5‬است که در این سری از اموزش ها نیز این نسخه را مد نظر قرار‬
‫خواهیم داد‪ .‬به طور کلی نسخه ‪ 5‬این زبان به منزله نسخه تکمیلی نسخه ‪ 4‬است با این تفاوت که یکسری تگ های تکمیلی به ان اضافه شده است که به‬
‫مراتب برنامه نویس را در ساخت صفحات وب یاری می رسانند‪ .‬عالوه بر این در نسخه ‪ 5‬از زبان اچ تی ام ال یک تفاوت عمده می بینیم و ان هم اینکه‬
‫نسخه ‪ 5‬زبان اچ تی ام ال این امکان را به برنامه نویسان می دهد تا عالوه بر صفحات وب بتوانند وب اپلیکیشن نیز طراحی کنند‪.‬‬
‫‪:HTML5‬‬
‫‪Html5‬تکنولوژی جدیدی است برای از بین بردن وابستگی وب سایت ها به نرم افزارهای مولتی مدیا و پخش کنندهای‬
‫ویدوئ مانند ادوب فلش و سیلور الیت‪ .‬در حقیقت ‪html5‬تمامی امکانات این نرم افزار ها را به راحتی با نوشتن چند‬
‫خط کد پیاده سازی می کند‪.‬گوگل و ایل برای پیشرفت ‪html5‬و جایگزین ان با ابزار فلش با جدیت تالش میکنند‪.‬‬
‫این افزونه در ای پد تاچ تاچ و ایفون و همچنین دستگاه جدید ای پد وجود ندارد‪.‬مدیراجرای ی اپل(استیو جایز)استفاده از‬
‫برنامه ی فلش را به دلیل مناسب نبودن برای محصوالت شرک تش ممنوع کرده و همچنین از فلش به دلیل مشغول کردن‬
‫زیاد پردازنده انتقاد کرده است‪.‬‬
‫به استدالل بعضی از شرکت های فن اوری اطالعات استفاده ی جامع و گسترده از ‪html5‬در نسل های بعدی تلفن‬
‫همراه امری ضروری است‪ .‬مرورگرهای وب در دستگاه های ایفون نسل سوم‪ ،‬حشمئ حقث و اندروید گوگل‪ ،‬مرورگرهای‬
‫مبتنی بر وب کیت را مورد استفاده قرار میدهند که موتور مرورگر وب کد باز است به این معنی که محتوای مبتنی بر‬
‫‪ ،html5‬برای مثال ویدوئ میتوانند به طور مستقیم وبدون نیاز به به هیچ افزونه ای در مرورگر موبایل قابل مشاهده‬
‫باشند‪.‬‬
‫چه چیزهای ی را میتوان از ‪ html5‬انتظار داشت؟‬
‫فضای افالین ‪Google Gears‬را میشناسید؟ ‪html5‬قرار است چیزی شبیه ان در خود داشته باشد‪ .‬برای مثال میتوان‬
‫با ‪html5‬ایمیلهای خود را به صورت افالین خواند‪ .‬مثال دیگر این است که سایتها میتوانند برخی از اطالعات خود را بر روی سیستم شما‬
‫ذخیره کنند و این یعنی چند برابر سرعتی که االن داریم درست مثل یک “ابر کوکی”‪.‬‬
‫اشکال غیر منظم‪ :‬با امکانات کنونی تنها شکلی که می توان برای قسمتهای صفحه داشت مستطیل است در حالیکه در ‪html5‬دیگر از این‬
‫محدودیت ها خبری نیست‪ .‬می توانید از هر گوشه صفحه بهترین استفاده را ببرید‪ .‬حتی میتوانید تنها با کد نویسی تصاویر‪ ,‬نمودارها و هرچیزی را‬
‫که فکر کنید در صفحه خود داشته باشید‪ .‬دیگر مجبور به استفاده از فلش یا افزونه های دیگر نیستید‪.‬‬
‫پخش صوت و ویدیو به صورت مستقل‪ :‬این یعنی اینکه دیگر الزم به استفاده از ‪Flash‬برای پخش ویدیو و صدا نیستید‪ .‬به راحتی می توان از‬
‫یک خط کد برای اینکار استفاده کرد و در عین حال تمام قابلیتهای ی نظیر عقب و جلو کردن‪ ,‬ذخیره ویدیو و … را در اختیار داشته باشید‪.‬‬
‫مکان یابی‪html5 :‬میتواند مکان شما را تشخیص دهد و نتایج جستجو را بر حسب مکان شما سفارشی کند و یا اینکه ورودی های توییتر شما‬
‫را برچسب گذاری کند‪.‬‬
‫فرمهای هوشمندتر‪ :‬جعبه های متن‪checkbox ,‬ها ‪ ,‬منوهای کشوی ی و تمام عناصر یک فرم هوشمندانه تر عمل خواهند کرد و به شما‬
‫امکانات بیشتری برای کنترل اطالعات خواهند داد‪ .‬برای مثال شما می توانید هنگام ورود اطالعات صحت و اعتبار انها را کنترل کنید‪ .‬همچنین‬
‫عناصر فرم تعامل بیشتری با هم خواهند داشت‪.‬‬
‫تمرکز بر برنامه های تحت وب‪ :‬اینده ازان برنامه های انالین خواهد بود‪html5 .‬این امکان را میدهد که یک برنامه تحت وب بدون درد و خون‬
‫ریزی با هر نوع سیستمی سازگار باشد و به کاربران این فرصت را میدهد تا بدون استفاده از ابزاری خاص از یک برنامه لذت ببرند‪ .‬با ‪html5‬‬
‫میتوان ابزارهای چت‪ ,‬انجمن‪ ,‬سایتهای ‪drag-and-drop‬نوشت‬
‫بررسی سرعت‬
‫به نظر خودم سرعت در ‪HTML5‬واقعا کافیه‪ .‬ولی باز هم به غیر از لود شدن کل صفحه لود شدن خود عنصر را هم می خواهد‪ .‬می‬
‫توانید از ‪chrome.angrybirds.com‬امتحان کنید! البته باید مرورگر حتما کروم باشه‪.‬‬
‫بررسی هماهنگی بیشتر‬
‫اک ثر مرورگرها دیگر با ‪HTML5‬هماهنگ شده اند‪ .‬ولی نحوه اجرای ان در هر مرورگر فرق داره‪ .‬فعال مرورگر کروم از نظر هماهنگی‬
‫بیشتر با ‪HTML5‬رتبه اول رو داره‪ .‬از اون جای ی که ‪HTML5‬یه دفعه گسترده شد‪ ،‬باالخره طول میکشه تا همه مرورگرها باهاش‬
‫هماهنگ بشن‬
‫رابط کاربری بهتر‬
‫اگه منظورم رو متوجه نشدید بخونید گرافیک! این ‪CSS 3‬که به ‪HTML5‬اضافه شده گرافیک خیلی باال رفته‪ .‬شما می تونید افکت‬
‫های زیاد فتوشاپ ی رو با چند خط ‪CSS 3‬و جاوا اسکریپت به تصویرتون اعمال کنید‪.‬‬
‫نوشتن کمتر‪ ،‬کار بیشتر (‪)Less Code, More Work‬‬
‫با اضافه شدن ابزار ‪Canvas‬و متدهاش به جای این که هر عکس رو جدا جدا با اسم پهلوی فایل بذاری‪ ،‬فقط کافیه همه عکس ها را در‬
‫یک عکس بزاری و بعد با ابزار مخصوص خودش عکس مورد نظرت رو جدا کنی‪ .‬تازه این فقط یه کارشه! بازی های ی مثل ‪Canvas‬‬
‫‪Rider‬از همین تگ برای راه اندازی بازیشون استفاده می کنند‪.‬‬
‫امنیت‬
‫ما در ‪HTML5‬چیزی داریم به اسم ‪ local Storage‬و ‪ session Storage‬که اطالعات در در سمت ‪Client‬‬
‫ذخیره می کنه‪ .‬حال به فرض ما که برنامه نویس باشیم از این دو برای حافظه بازی استفاده کردیم‪ .‬یک نفر براحتی می تونه بازی ما رو هک‬
‫کنه و مرحله های بازی را باز کنه‪ .‬حال این چیز مهمی نیست‪.‬‬
‫تاریخچه ‪:CSS‬‬
‫زمانیکه زبان سی اس اس )‪(CSS‬بوجود نیامده بود‪ ،‬هر مرورگری دارای قواعد مختص به خود برای نمایش تگ های اچ تی ام ال‬
‫)‪(HTML‬بود‪ .‬بنابراین می توانستیم این انتظار را داشته باشیم که یک وب سایت در مرورگر الف با ظاهر به مراتب متفاوت‬
‫تری نسب به مرورگر ب به نمایش در اید‪.‬‬
‫باالخره به خاطر وجود این ناهماهنگی ها در سال ‪ 1996‬نسخه اول زبان سی اس اس )‪(CSS‬تحت عنوان ‪CSS 1.0‬ایجاد‬
‫شد و در سال ‪ 1998‬هم نسخه ‪CSS 2.0‬به بازار عرضه شد‪ .‬سپس در سال ‪ 2004‬با اعمال برخی بازنگری ها در کدهای سی اس‬
‫اس‪ ،‬نسخه ‪CSS 2.1‬شکل گرفت و در نهایت در سال ‪ 2011‬با رفع برخی مشکالت این نسخه‪ ،‬مجدد تحت همین عنوان به‬
‫دنیا عرضه شد و این نسخه از سی اس اس )‪(CSS‬همان نسخه ای است که طراحان وب با ان سر و کار دارند‪.‬‬
‫با توجه به سرعت گسترش وب و همچنین ایجاد وب اپلیکیشن ها و دستگاه های موبایل نیاز به نسخه جدیدی از سی اس اس بود‬
‫که می بایست رویکردی ً‬
‫کامال متفاوت را اتخاذ می کرد‪ .‬از این رو نسخه ‪CSS 3‬ایجاد شد که هنوز هم در حال توسعه و تکمیل‬
‫است‪.‬‬
‫استایل ‪ CSS‬چیست؟‬
‫‬‫‪-‬‬
‫‬‫‪-‬‬
‫‪-‬‬
‫‪-‬‬
‫‪CSS‬مخفف کلمه ‪Cascading Style Sheets‬میباشند‪.‬‬
‫ اولین ورژن استایلها در سال ‪ ۱۹۹۶‬ساخته شد‪ .‬که اولین ورژن ان ‪CSS1‬بود‪.‬‬‫ دیگر وژن ان ‪CSS2‬می باشد که در سال ‪ ۱۹۹۸‬ساخته شد که بیشتر برای ویرایش صفحات‪ ،‬نحوه نمایشها تگها و … کاربرد دارد‪.‬‬‫ فایل استایلها با فرمت ‪CSS‬ذخیره میشوند‪.‬‬‫ جدا کردن ظاهر صفحات اعم از طرح بندی و رنگ بندی و… از محتوای صفحات مانند کد های ‪HTML‬و …‬‫انواع استایلها‪:‬‬
‫‪:Inline Style .۱‬‬
‫این نوع استایل در داخل تگهای ‪HTML‬به کار گرفته میشوند‪ ،‬و این استایل فقط بروی همان تگ به خصوص تاثیر خواهد گذاشت و به‬
‫صورت زیر نوشته خواهد شد‪.‬‬
‫‪:Embedded or Global Style .۲‬‬
‫در این نوع‪ ،‬استایل نوشته شده در تمامی صفحه تاثیر خواهد گذاشت‪ ،‬اینرا بین دو تگ (< )>‪head></head‬به صورت زیر نوشته‬
‫خواهد شد‪.‬‬
‫‪:Linked or External style sheet .۳‬‬
‫نوع اخر هم معروف به استایلهای خارجی هستند که به صورت لینک فایل استایل را به صفحات خود لینک میدهید‪ .‬فایلهای استایل با فرمت‬
‫‪CSS‬ذخیره میشوند و به صورت زیر به صفحات لینک داده میشود‪.‬‬
‫‪5‬مورد از اثرات ‪:CSS3‬‬
‫گوشههای گرد‬
‫اینترنت به تدریج دارد گردتر میشود‪ ،‬ولی اکنون با ‪CSS‬از حرکت باز ایستاده و جامد شده است‪ .‬به مستطیل دور این پارگراف نگاهی بیاندارید‪.‬فقط‬
‫یک تصویر نیست‪-‬روی ان کلیک راست کن تا ببینید‪CSS .‬بدون نقص و خالص‪.‬‬
‫سایهی متن‬
‫متن گاهی اوقات می تواند واقعا به نوبه ی خود خشن به نظر بیایند‪ ،‬اما کمی سایه ساده واقعا به اشیاء کمک می کند‪.‬سایه ای را که به این پارگراف‬
‫داده شده را بررسی کنید‪.‬‬
‫شیب‬
‫دیگر رنگ های یکنواخت و تصاویرشیب دارپس زمینه وجود نخواهد داشت‪ .‬اکنون تنها با استفاده از ‪CSS‬میتوان شیب های محشری به وجود اورد‪.‬‬
‫متاسفانه‪ ،‬به خاطر مسائل ناسازگاری جاری بین مرورگرها نیاز به چند خط دارید‪ ،‬ولی میتوانید از ابزاری که بعدا برایتان توضیح میدهم برای ایجاد‬
‫اتوماتیک ان استفاده کنید‪.‬‬
‫چرخش‬
‫این که کاربردی برای این از لحاظ متن تصور کرد کاری بس دشوار است ولی برای مثال ‪،‬هنگام استفاده از تصاویر می توانید عناصر طراحی خوبی به‬
‫متن اضافه کنید‪ .‬بعالوه‪ ،‬توجه داشته باشید که اگرچه این تصویر چرخانده شده است‪ ،‬از انجا که هنوز متنی عادی است هنوز می توانید ان را‬
‫انتخاب و با ان ارتباط متقابل داشته باشید‪.‬‬
‫انیمیشن‬
‫اه‪ ،‬بله ‪ ،‬من بهترین نک ته را تا حاال نگه داشته ام‪CSS .‬اشکال مختلف انیمیشن را برای هرتعداد از تاثیرات خوب ‪CSS‬که توصیف ان شد معرفی‬
‫می کند‪ .‬در این پارگراف انتقال مالکیت را انگونه که در زیر امده تعریف کرده ام‪ ،‬همچنین رنگ ساده پس زمینه و چرخش هنگام پرسه روی ان نیز‬
‫تعریف شده است‪ .‬اگر هنوز برای شما بیان نشده این متن از پارگراف را ببینید تا تاثیر عملی را ببینید‪ .‬شما می توانید هر چیزی را به خوبی زنده کنید‪.‬‬
‫هر عنصری را که در صدد چرخاندنش باشید احتیاج به یک کد انتقالی شبیه به این دارد‪.‬همچنین نیاز است که از بعضی از ‪CSS‬های مشابه استفاده‬
‫کنید ( مثل‪ :‬مترصد بودن برای تغییر هر ویژگی که می خواهید انیمیشن کنید مثل رنگ‪،‬اندازه ‪ ،‬یا چرخش‬
‫ناسازگاری مرورگر متقابل‬
‫اگرچه اک ثر مرورگرهای امروزی به نوعی از تمام ‪CSS‬ها پشتیبانی میکند ولی بعضی از انها هنوز نیازمند کد و یا ضربه ای تا حدودی متفاوت هستند تا‬
‫ان ها را وادار به کار با اجرای استاندارد بخصوصشان کنند‪.‬برای مثال‪ ،‬در کد باال‪ ،‬نمونه های بسیاری ازمز) ( ‪moz‬یا وب کیت) ( ‪weskit‬را‬
‫مشاهده می کنید که بعضی از مشخصات ‪CSS‬را به پیش می راند که یا به مرورگرهای براساس موزیال و یا وب کیت مربوط میشود‪ .‬نوشتن این‬
‫خطهای اضافی می تواند دردسرسازشود‪ ،‬بنابراین توجه داشته باشید ژنراتور ‪CSS3‬ان ها را برای شما بنویسد‬
‫‪CSS‬چه تفاوتی با ‪HTML‬دارد؟‬
‫از ‪HTML‬برای ایجاد ساختار و عناصر تشکیل دهنده صفحه استفاده می شود‪ ،‬صفحه ایجاد شده با ‪HTML‬فرمت و قالب مشخصی ندارد‬
‫و عناصر صفحه به شکل نامرتبی در وب سایت نمایان می شوند‪ .‬به همین دلیل باید از ‪CSS‬استفاده کرد تا بتوان صفحات ایجاد شده با‬
‫‪HTML‬را به فرم و قالب کاربر پسندی تبدیل کرد‪.‬‬
‫نتیجه گیری‬
‫وب میخواهد کاری کند که تمام قسمتها با استفاده از ضمیمههای ‪ CSS3‬و ‪ HTML5‬جدید هیجان انگیز تر شوند‪.‬مسلم بدانید‪ ،‬ما‬
‫جهش ناگهانی دیگری از متن و همچنین نسبت باالی ی از سر و صدا را در متن واقعی خواهیم دید( درست مثل کاری که وقتی ‪GIF‬های انیمیشن‬
‫شده برای اولین بار پدیدار شدند انجام دادیم) ولی در دراز مدت خواهیم اموخت که چگونه از ابزارهای ‪ CSS3‬برای ایجاد هم کنشگرهای وب‬
‫جالبتری استفاده کرد ‪ .‬و همیشه هم میتوانید هر وقت دلتان خواست خاموشش کنید!‬
‫اگر شما خودتان طراح یا توسعه دهنده وب هستید ‪ ،‬فقط به خاطر داشته باشید که ‪CSS3‬نباید تنها گزینه ی انتخاب باشد‪.‬اگر سایت شما‬
‫بدون ‪ CSS3‬کار نمیکند به این خاطر بوده است که از ان به درستی استفاده نکرده اید‪ .‬از ‪CSS‬بایستی برای افزایش تجربه استفاده کرد نه‬
‫کارامدی برنامه‪.‬‬
‫سرفصل های اموزشی و انچه در این مجموعه خواهید اموخت عبارتند از ‪:‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫معرفی زبان طراحی اچ تی ام ال‬
‫اشنای ی با تگ ها‬
‫اشنای ی با ارتباط متن ها و تگ ها‬
‫اشنای ی با قرار دادن لینک در صفحات‬
‫اشنای ی با قرار دادن تصاویر در صفحات‬
‫اشنای ی با ایجاد جداول در صفحات‬
‫اشنای ی با اسکریپت های بوت استراپ‬
‫اشنای ی با تقسیم بندی صفحه توسط جدول‬
‫اشنای ی با ارتباط بین جداول و متون در صفحات‬
‫اشنای ی با لیست های مرتب شده و غیر مرتب شده‬
‫اشنای ی با استایل دادن به صفحات و متون‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫‪‬‬
‫اشنای ی با روش طراحی به کمک دیو‬
‫اشنای ی با کسکیت استایل شیت ها (‪)CSS‬‬
‫اشنای ی با روش اعمال استایل درون خطی‬
‫اشنای ی با روش اعمال استایل درون صفحه ای‬
‫اشنای ی با روش اعمال استایل خارجی‬
‫اشنای ی با تگ ها و استایل ها‬
‫اشنای ی با ای دی ها و استایل ها‬
‫اشنای ی با کالس ها و استایل ها‬
‫اشنای ی با تصاویر و استایل ها‬
‫اشنای ی با دیو ها و استایل ها‬