دسته ها
دستهها
- php (1)
- امنیت (6)
- اندروید (3)
- اینترنت (2)
- برنامه نویسی (14)
- بوت استرپ (1)
- پایتون (1)
- تازه ها (22)
- ترفند ها (30)
- تکنولوژی های جدید (1)
- جاوا (2)
- جاوا اسکریپت (2)
- سئو (1)
- سخت افزار (4)
- صنعت بازی (1)
- صنعت رباتیک (1)
- طراحی وب (14)
- عکاسی (1)
- فضاهای ذخیره سازی (1)
- فلاتر (1)
- گوشی های هوشمند (1)
- متفرقه (1)
- موبایل (3)
- نرم افزار (17)
- هوش مصنوعی (4)
- وب (1)
- وردپرس (7)
- ویدئو های آموزشی (24)
اولین صفحه html
یادگیری HTML و CSS برای هر توسعه دهنده وب یک اصل اساسی است. بنابرین موستانگ قصد دارد تا در این دوره شما را با اصلی ترین قواعد آن ها آشنا کند. در این درس با ما همراه باشید تا اولین صفحه html خود را بسازید.
برای شروع، پیشنهاد می شود که یک ویرایشگر برای کدنویسی HTML و CSS دانلود نمایید. در زیر لیستی از ادیتورهای مخصوص HTML ، CSS و JavaScript را مشاهده می کنید:
مقدمه
HTML (HyperText Markup Language) طی سال ها و به منظور انتقال اطلاعات در اینترنت توسط هایپرلینک ها یا همان لینک ها، طراحی شده است. برخلاف PDF، یک صفحه HTML بسیار پویاتر بوده و این امکان را به شما می دهد که با کلیک کردن بر روی لینک ها و تعامل با صفحه، وب را پیمایش کنید. لینک ها می توانند شما را به مکانی دیگر در صفحه فعلی و یا به صفحه ای دیگر در اینترنت ببرند.
آخرین نسخه معرفی شده، HTML 5.0 است که نسبت به آنچه انتظار می رفت، قابلیت های بسیار بیشتری دارد. html ، با بکارگیری قدرتِ CSS و JavaScript ، یک عرصه کامل و جامع را برای ساخت رابط های کاربری فراهم می آورد. HTML 5.0 آنقدر قدرت داشت که توانست Adobe Flash، Microsoft’s Silverlight و تقریبا تمامی پلاگین های HTML ، نظیر ویدیو پلیرها، اپلت های جاوا و غیره را نابود کند.
اما چه تفاوتی میان HTML ، CSS و JavaScript وجود دارد؟
در وهله اول باید گفت که تمامی این ها می توانند در یک صفحه HTML جاسازی شوند. بدین معنی که مرورگر ابتدا یک صفحه HTML را لود می کند، و تنها پس از آن است که می فهمد چه چیزهای دیگر را باید از آنجا لود کند.
- یک صفحه HTML ، در واقع یک سند HTML است که محتویات صفحه را توسط یک زبان مارک آپ (markup)، شبیه XML، تعریف می کند.
- یک CSS stylesheet، استایل عناصر صفحه HTML را تعریف می کند. css، یا درون خود صفحه جاسازی شده و یا با استفاده از یک تگ لود می شود.
- JavaScript، یک زبان برنامه نویسی است که با استفاده از یک API بنام DOM Bindings (Document Object Model) ، به منظور تعامل با صفحه استفاده می شود. در واقع می توان گفت که DOM Bindings چسبی میان زبان برنامه نویسی و صفحه ای است که در مرورگر لود شده است.
این دوره آموزشی، بخش HTML و CSS را پوشش خواهد داد.
اولین صفحه html شما: ! Hello World
بیایید با ساختن یک صفحه ساده شروع کنیم. یک صفحه HTML ، ساختار زیر را دارد:
<!DOCTYPE html>
<html>
<head>
<!-- head definitions go here -->
</head>
<body>
<!-- the content goes here -->
</body>
</html>
این صفحه یک تیتر دارد. تیتر همان عبارتی است که در تب مرورگر شما نمایش داده می شود. عنصر <title>
، تیتر صفحه را تعیین می کند.
عنصر <p>
، یک پاراگراف را تعیین می کند: یعنی پاره متنی که در بالا و پایین خود اندکی فاصله دارد.
توجه کنید که تمامی عناصر تعریف شده، یک تگ شروع و یک تگ پایان (همراه با /) دارند. هرچه میان این دو باشد، محتوای تگ است. محتوای یک تگ، می تواند شامل تگ های دیگر نیز باشد.
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
</head>
<body>
<p>This is an example of a simple HTML page with one paragraph.</p>
</body>
</html>
می توانید کد بالا را در یک ادیتور بنویسید و آن را با نام ” index.html ” ذخیره کنید. فایل “index.html “، فایلی است که یک مرورگر بطور پیشفرض برای دسترسی به یک وبسایت جستجو می کند. بعد از ذخیره فایل، می توانید آن را با دو بار کلیک، درون مرورگر خود باز کنید.
اکنون که ساختار ابتدایی یک صفحه را متوجه شدید، بیایید امتحانش کنیم.
تمرین (ساخت یک صفحه html)
1. یک تگ به عنوان تیتر (<title>
) با محتوای “Hello, World!” بسازید.
2. یک تگ پاراگراف (<p>
) به تگ body اضافه کنید، با این محتوا: “Hello, World!”
در نهایت
[*] در این درس، اولین صفحه html خود را ساختیم و با نحوه قراردهی تگ ها آشنا شدیم. در درس آینده با موستانگ همراه باشید تا شروع کنیم به یادگیری ساختارهای مهم html.
[*] پاسخ تمرین، سوالات و نظرات خود را می توانید در پایین این نوشته و در قسمت دیدگاه ها ثبت کنید. موستانگ از بازخوردهای شما استقبال خواهد کرد.