آموزش برنامه نویسی وب🌐: بخش html قسمت دهم(Iframe, Javascript, Meta tags)
در این قسمت از سری آموزش برنامه نویسی وب در وبلاگ آزادی به موضوعات زیر خواهیم پرداخت.
- تگ Iframe
- تگ های متا در اچ تی ام ال
- نوشتن جاوا اسکریپت در اچ تی ام ال
قسمت قبلی
Iframe چیست و چگونه استفاده میشود؟
تگ Iframe برای گذاشتن یک صفحه وب دیگر درون یک سند اچ تی ام ال مورد استفاده قرار میگیرد.
با استفاده از صفت src میتوانید آدرس فایل مورد نظر خود را بدهید.
همچنین میتوانید با استفاده از صفت title یک توضیح در مورد iframe اضافه کنید.
کد زیر رو بررسی و امتحان کنید.
<h1>تگ Iframe</h1>
<iframe src="https://blogfreedom.ir" title="وبلاگ آزادی همه میتوانند در آن بنویسند">
</iframe>
همچنین میتوانید با استفاده از صفات width و height طول و ارتفاع iframe را مشخص کنید توصیه میشود.
برای بهم نریختن مطالب حتما طول و ارتفاع iframe ها رو مشخص کنید.
در کد زیر صفات width و height تنظیم شده اند.
<h1>تگ Iframe</h1>
<iframe src="https://blogfreedom.ir" title="وبلاگ آزادی همه میتوانند در آن بنویسند" width='100%' height='50%'>
</iframe>
میتوانید با استفاده ویژگی border در CSS حاشیه iframe را حذف کنید.
میتوانید با استفاده از صفت name یک نام، به iframe اختصاص دهید و با استفاده از تگ a لینکی بسازید و صفت target اش را با نامی که برای iframe انتخاب کردید، برابر قرار دهید و آن لینک را درون iframe باز کنید.
کد زیر را دقت و تمرین کنید.
<h1>تگ Iframe</h1>
<iframe src="https://blogfreedom.ir" title="وبلاگ آزادی همه میتوانند در آن بنویسند" width='100%' height='50%' name='iframe_b' style='border:n;'>
</iframe>
<a href='https://blogfreedom.ir/document.php' target='iframe_b'>رفتن به صفحه اسناد
</a>
جاوا اسکریپت در اچ تی ام ال چگونه نوشته میشود؟
جاوا اسکریپت برای پویایی و تعاملی کردن صفحات وب استفاده میشود.
جاوا اسکریپت به سه صورت درون خطی(داخل صفات رویدادها) و داخلی با تگ script و خارجی با استفاده از تگ script و صفت src نوشته میشود.
نکات:
تگ script درست است که در آخر سند اچ تی ام ال نوشته شود.
نوشتن جاوا اسکریپت بصورت درون خطی معمولا برای صدا زدن یک تابع یا نمایش یک پیام مورد استفاده قرار میگیرد.
به کد زیر که با صفت رویداد داده شده به یک عنصر باعث میشود وقتی روی آن کلیک شد، یک پیغام به کاربر نمایش داده شود.
کدو نمیتونم بزارم خودتون بفهمید.
تگ های متا
تگ های متا برای ارائه توضیحاتی در مورد محتوای صفحه است، این تگ های خیلی برای موتور های جستجو مهم هستند و در سئوی سایت خیلی تاثیر گذارند. این تگ ها به کاربر نمایش داده نمیشوند و در head نوشته میشوند
در زیر جدول مهمترین تگ های متا رو میتونید ببینید.
کد |
تاثیر |
<meta charset="UTF-8"> |
اعلام مجموعه کاراکتر مورد استفاده برای مرورگر |
| تعریف کلمات کلیدی صفحه |
<meta name="description" content="Freedom Blog Ideas without censorship"> |
توضیحات در مورد صفحه |
<meta name='author' content='System Down'> |
نویسنده صفحه |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
اعلام کردن Viewport به مرورگر برای Responsive سایت |
قسمت بعدی
add comment
please login to add or edit your comment
login nowpost comments
no comments added yet!