پاسخ : آموزش جامع html-xhtml
پاسخ : آموزش جامع html-xhtml
پاسخ : آموزش جامع html-xhtml
صرفا به عنوان یک پیشنهاد عرض می کنم... با توجه به اینکه دوره html 4.0 و xhtml 1.0 یا همون html 4.1 سر اومده و تقریبا از رده خارج شده اند، بهتر است تمرکز خود را تماما بر روی نسخه جدید یعنی html 5 قرار دهید و بصورت اصولی و استاندارد اقدام به آموزش آن بنمایید و در این حین تمام موارد افزوده شده، تغییر کرده و یا حذف شده را نیز مد نظر قرار دهید.
موفق باشید
پاسخ : آموزش جامع html-xhtml
با سلام
امید واریم مثله بعضی از تایپیک ها نباشه بعد از یک هفته دیگه بررسی نشه انشالله آموزش ها تا پایان ادامه داشته باشه
موفق باشید
پاسخ : آموزش جامع html-xhtml
بخش اول آموزش
شرح مفاهیم زبان های HTML-XHTML
HTML چیست و چه کاربردی دارد؟ به زبان ساده، یک صفحه وب با استفاده از چند زبان کدنویسی ساخته شده است که محور تمامی این زبان های کدنویسی و برنامه نویسی، زبانی به اسم HTML است. خود این زبان که به اسم HTML شناخته شده است مخفف کلمه Hyper Text Markup Language است که معادل فارسی آن "زبان علامت گذاری فرامتنی" است. حال مقداری بیشتر در مورد مفهوم این کلمه می پردازیم :
Hypertext : این کلمه نشانه فرامتنی بودن این زبان است که مشخصا به پیوندها (لینکها) و یا به بیان مشخص تر به ابرپیوندها اشاره دارد. شما اگر وارد یک صفحه وب شده باشید و اساس آن HTML باشد، متوجه خواهید شد که این صفحه علاوه بر محتویات، یکسری پیوندها (لینکها) شما را با دنیای بسیار وسیع خارج از محدوده این سایت میبرد. که علت نام گذاری "فرامتنی" وجود همین خاصیت میباشد.
Markup : معنای علامت گذاری میدهید که بصورت جزئی تر علامت گذاری با برچسب زدن متن ایجاد میشود برچسب گذاری در زبان HTML بسیار پرکاربرد است. کلمه برچسب گذاری را نیز تگ (Tag) نیز میگویند که برای ورود به دنیای HTML و کدنویسی بسیار فراوان با این کلمه (تگ) سروکار خواهیم داشت.
Language : نشان دهنده این است که زبان کدنویسی HTML به عنوان یک زبان برنامه نویسی در نظر گرفته می شود.
XHTML چیست و چه کاربردهایی دارد؟ زمانی که نسخه های زبان HTML شروع به پیشرفت کرد و به نسخه 4.01 رسید، سازندگان و توسعه دهندگان از یک ابتکار و خلاقیت جالب استفاده کردن و زبان HTML را با زبان xml ترکیب کردند و زبان XHTML اینگونه شکل گرفت، اما تفاوت زیادی با HTML ندارد و تفاوت عمده بر روی قوانین تگ نویسی تمرکز دارد. پس می توان گفت زبان XHTML همان زبان HTML است اما با مقدار ناچیزی تفاوت در قوانین تگ نویسی است. در این آموزش مبنای آموزش بر حسب زبان XHTML است زیرا کاربرد این زبان استاندارد بودن آن است و نسبتا با تمامی مرورگرها سازگار است.
اما تفاوت ها را در یک لیست آماده کرده ایم که جزئیات آنها را در این لیست شرح نداده زیرا در حین آموزش بر اساس همین قوانین آموزش داده می شود و نیازی به شرح دادن جزئیات بیشتر در این لیست نیست. تمایزهای زبان HTML و XHTML بصورت زیر است :
- در XHTML بستن تمامی تگ ها الزامی است.
- در XHTML باید تقدم و تاخر باز و بسته شدن تگ ها رعایت شود.
- در XHTML نام تگ ها و خاصیت های آنها باید با حروف کوچک نوشته شود.
- فایل XHTML باید حاوی یک عنصر ریشه <html> باشد.
- کلیه تصاویر باید دارای توضیح باشند.
تمامی آموزشهای HTML در این آموزش براساس استانداردهای XHTML است.
اما براش شروع آموزش به چه پیش نیازهایی احتیاج است ؟
حداقل سیستم مورد نیاز :
می توانیم با برنامه notepad ویندوز، کدنویسی را شروع کنیم. در آخر برای ذخیره سازی سند به آخر اسم فایل .html می افزاییم. و همچنین برای پشتیبانی از زبان فارسی در صفحه وب قسمت encoding را برابر utf-8 قرار می دهیم.
در مورد قدرت سیستم هم نیازی به توضیح نیست چون تقریبا با تمام سیستم ها قابل اجرا است اما برای اجرای درست نتایج کدنویسی چون محور آموزش ما بر اساس HTML 5 است بهتر است از نسخه 9 اینترنت اکسپلورر استفاده کنیم که تمامی تگ ها را پشتیبانی کند. اما در حین آموزش نحوه کدنویسی استاندارد برای تمامی مرورگرها آموزش داده می شود.
در بالا توضیح داده شد که مهم ترین و پایه ای ترین مسئله در HTML تگ ها است. و برای شروع آموزش باید پایه ای ترین مسئله یعنی تگ ها شروع کنیم.
آشنایی با ساختار تگ ها :
قبل از آشنا شدن با ساختار تگ باید با مفهوم آن آشنا شده و علت وجود آن را درک کرد.!
ما اگر بخواهیم که محتوای درون یک سایت را درون یک قالب نمایش دهیم و در یک چهارچوب از قوانین خاص باشد، طبیعتا باید یکسری مفاهیم یا دستورات برای محتویات و قالب نوشته شود. حال برای اینکه این محتویات و متن با دستورات قاطی نشوند، دستورات را نیز درون یک فرمت بندی بنام تگ مینویسیم.
اما حال ساختار تگ ها : هر تگ بیانگر یک عمل است و هر عمل دارای یکسری مخلفات و خاصیت ها است. این خاصیت ها خود باید مقداری داشته باشند. شاید اندکی سردرگم شده باشید ! اما تعجب نکنید چون برای شروع عادی است.
ساختار کلی به این صورت است :
کد:
<tag attribute="value">
کلمه tag مشخصا بیانگر نوع عمل، و کلمه attribute نشانگر خاصیتی است که به تگ اضافه می شود و بیشتر از ویژگی های تگ استفاده می کند. و کلمه value مشخص کننده مقداری است که برای هر خاصیت قائل می شویم.!
با یک مثال شروع میکنیم :
برای قرار دادن یک عکس در صفحه وب از تگ img استفاده میکنیم و فراخواندن آدرس عکس را با خاصیت src و همچنین مقدار این خاصیت عبارت است از آدرس اینترنتی عکس. که بصورت زیر نوشته می شود :
کد:
<img src="http://www.exaple.com/image.jpg" />
مثال بالا مشخص میکنید یک تصویر با آدرس اینترنتی ذکر شده در صفحه وب قرار گیرد. این تگ دارای خاصیت ها و مقدارهای بیشتری است که فعلا موضوع بحث ما نیستند.!
آیا تگ ها کلا به همین صورت نوشته می شوند و یک نوع هستند؟ خیر. دو نوع تگ وجود دارد یکی تگ یک طرفه که بیانگر دستور بدون اشاره متمرکز به محتویات است مانند مثال بالا، که خود یا دستوری مجزا و یا محتوایی مجزا است. و تگ دو طرفه، که می خواهد به متن و یا محتویات یک فرمت داده شود و مشخصا تمرکز اصلی بر روی محتویات دیگر است. و استقلال این نوع تگ به محتویات دیگر وابسته است.
به عنوان مثال : شما اگر بخواهید یک متن را در یک پاراگراف چپ چین نوشته و دو خط پایین تر از آن پاراگراف نیز یک متن در قالب پاراگراف دیگر بنویسید باید بصورت زیر عمل کنید :
کد:
<p align="left">This a test paragraph 1</p>
<br /><br />
<p align="left">This a test paragraph 2</p>
در مثال بالا دو تفاوت میان دو تگ p و br وجود دارد تگ p به محتویات اشاره دارد و در اصل برای محتویات ساخته شده است، پس این محتوایتی که فرمت داده می شود، باید یک محدوده داشته باشد. برای شروع فرمت گذاری از خود تگ آغاز میکنیم که تگ آغازی گفته می شود و برای تمام کردن محدوده فرمت گذاری روی متن از تگ پایانی استفاده می شود که ساختار کلی تگ پایانی، به این صورت نوشته می شود : اما تگ br مشخصا به محتویات و متن اشاره ای ندارد و صرفا یک دستور است که یک سطر شکسته شود و به خط بعد برود. این نوع تگ ها را تگ یک طرفه گویند زیرا نیاز به تگ پایانی ندارد و محدوده ای جهت مشخص شدن وجود ندارد. و ساختار کلی بصورت مقابل نشان داده می شود :
کد:
<tag attribute="value" />
پاسخ : آموزش جامع html-xhtml
دوستان خواهشا پست هاتون رو پاک کنید که آموزش رو ادامه بدم
پاسخ : آموزش جامع html-xhtml
متاسفام واقعا یکی هم داره بدون چشم داشتی میخاد کاری کنه از کردش پشیمونش میکنن عذر میخام از استاتر خواهش میکنم ادامه بدید ب نظرات اسپم و ترول توجهی نمیکنیم
