Rayaniko

توسط: | نظر ها: 0 | زمان انتشار: ۱۳۹۵/۶/۱۳

آموزش HTML5 و CSS3 - معرفی تگ ها (tag)

به توکل نام عظمت بسم الله الرحمن الرحیم

 

<html> </html> هر سند html با این تگ شروع می شود.

<head> </head> میشه گفت در مورد سند و هرچیزه دیگه اطلاعات بدید. همترین چیزه ممکن برای این تگ اینه که در صفحه بروزر ما دیده نمیشه. برای دیدن این اطلاعات روی صفحه کلیک راست کنید

<body> </body> ساختار اصلی سایتتون باید اینجا کدنویسی بشهو بر عکس head هرچی که بنویسید داخل بروزر کاربر نمایش داده میشه.

 

 تگ هایی که میتونیم داخل head صفحه بزاریم:

<title> </title> عنوان یا تایتل هر صفحه رو میتونیم مشخص کنیم.

<link> برای آدرس دهی فایل های مختلف مانند css

<meta> اطلاعات رو داخل این تگ مینویسیم. مثلا نویسنده، کلمات کلیدی که برای سرچ مفیده، آخرین تغیرات سایت و ...

تعدادی رو براتون نمایش میدم: <head>

برای اینکه به بروزر بفهمون داخل صفحه ما کلمات فارسی وجود دلره تا به درستی نمایش بده.
 <meta charset="UTF-8">

توضیح هرصفحه
<meta name="description" content="RayaNiko.Com">

کلمات کلیدی
<meta name="keywords" content="HTML,CSS,JavaScript,php,symfony">

نویسنده
<meta name="author" content="HamidRezaRanji">
</head>

 

قبل از اینکه وارد تگ های body بشیم توضیح در مورده  css بدم.

css رو میتونیم سه حالت بنویسیم که اسامی این سه حالت: Inline, Internal, External

1. Inline :

<body>
    <p style="color: red"> RayaNiko.Com </p>
</body>

اگه توجه کرده باشید داخل تگ p یه attr به نام style داریم که میتونیم با این attr استایل بدیم. این نوع استایل دادن رو Inline میگن.

 

2. Internal :

 <head>
<style>
body {
    background-color: linen;
}

h1 {
    color: maroon;
    margin-left: 40px;
}
</style>
</head>

داخل  head با تگی به نام <style> مینویسیم.

 

3. External : اما اگه میخواید به صورت حرفه ای کد نویسی کنید از این روش استفاده کنید. مزیت مهم این روش اینه که تو یه صفحه تعداد خیلی زیادی css داریم پس اگه از روش های دیگه استفاده کنیم کدمون خیلی شلوغ میشه و برای دیباگ کردن مشکل.

کنار فایل html یه پوشه به نام css درست کنید وبعد داخل اون پوشه یه فایل با فرمت css مثلا style.css بسازید. حالا زریقه دسترسیش به html ما به این صورت است:

 <head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

این کار یعنی شما css هاتون رو داخل فایل دیگه نوشتید اما با لینک دادن گفتید که بالا صفحه داخل head سی ای هاتون وجود داره. بعد از این کار ها هم داخله Internal و هم External بحث class ها و id ها میاد وسط:

<body>
    <p class="red"> RayaNiko.Com </p>
</body>

 

منبع: رایانیکو

 

رایانیکو راهی نو اندیشه نیکو
 

پسندیدم

3

برای ارسال نظر لطفا وارد شوید