✅ به نام خدا
⭕ جلسه ششم(المان ها در Html)
💠 یک المان در Html توسط تگ شروع،محتوا و تگ پایان ساخته می شود.
<تگ شروع> محتوا <تگ پایانی/>
💢نکته: بعضی از المان ها هیچ محتوایی ندارند. مانند <br/> . به این المان ها، المان خالی میگویند و تگ پایان ندارند!
💠 المان های تودرتو html
💢المان ها در html میتوانند تودرتو باشند. یعنی اینکه چندین المان میتوانند داخل یک المان باشند.
مثال زیر شامل چهار المان است.
<html> <body> <h1> <p>
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
⭕ توضیح مثال بالا
💢 المان <html> یک المان ریشه است و همه سند را تعریف میکند. این المان یک تگ شروع <html> و یک تگ پایان دارد <html/>. داخل این المان یک المان دیگر وجود دارد به نام <body>.
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
🔰المان <body> بدنه سند را تعریف میکند. این المان یک تگ شروع <body> و یک تگ پایان <body/> دارد.
💠داخل این المان دو المان دیگر به نام های <h1> و <p> وجود دارد.
<h1>My First Heading</h1>
<p>My first paragraph.</p>
💢المان <h1 > یک عنوان را ایجاد میکند.
یک تگ شروع <h1> و یک تگ پایان <h1/> دارد.
<h1>My First Heading</h1>
💢 المان <p> یک پاراگراف را ایجاد میکند.
یک تگ شروع <p> و تگ پایان <p/> دارد.
<p>My first paragraph.</p>
‼هرگز تگ پایان را فراموش نکنید!!
بعضی از المان های html به درستی نمایش داده میشوند حتی اگر تگ پایان را ننویسید.
<html>
<body>
<p>This is a paragraph
<p>This is a paragraph
</body>
</html>
ولی به هیچ عنوان این کار را انجام ندهید! چون باعث خطاهای غیر منتظره میشود.
💠المان های خالی html
💢 به المان های html که هیچگونه محتوایی نداشته باشند المان های خالی میگویند.
❇تگ <br> باعث شکسته شدن خط میشود. این تگ یک المان خالی محسوب میشود و تگ پایان ندارد.
<p>This is a <br> paragraph with a line break.</p>
‼html به حروف بزرگ و کوچک حساس نیست.
💠 یعنی اینکه تگ <P> با تگ <P> هیچ فرقی ندارد.
ولی پیشنهاد ما این است که از حروف کوچک استفاده کنید.
#HTML
🖥 @Computer_MCH
⭕ جلسه ششم(المان ها در Html)
💠 یک المان در Html توسط تگ شروع،محتوا و تگ پایان ساخته می شود.
<تگ شروع> محتوا <تگ پایانی/>
💢نکته: بعضی از المان ها هیچ محتوایی ندارند. مانند <br/> . به این المان ها، المان خالی میگویند و تگ پایان ندارند!
💠 المان های تودرتو html
💢المان ها در html میتوانند تودرتو باشند. یعنی اینکه چندین المان میتوانند داخل یک المان باشند.
مثال زیر شامل چهار المان است.
<html> <body> <h1> <p>
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
⭕ توضیح مثال بالا
💢 المان <html> یک المان ریشه است و همه سند را تعریف میکند. این المان یک تگ شروع <html> و یک تگ پایان دارد <html/>. داخل این المان یک المان دیگر وجود دارد به نام <body>.
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
🔰المان <body> بدنه سند را تعریف میکند. این المان یک تگ شروع <body> و یک تگ پایان <body/> دارد.
💠داخل این المان دو المان دیگر به نام های <h1> و <p> وجود دارد.
<h1>My First Heading</h1>
<p>My first paragraph.</p>
💢المان <h1 > یک عنوان را ایجاد میکند.
یک تگ شروع <h1> و یک تگ پایان <h1/> دارد.
<h1>My First Heading</h1>
💢 المان <p> یک پاراگراف را ایجاد میکند.
یک تگ شروع <p> و تگ پایان <p/> دارد.
<p>My first paragraph.</p>
‼هرگز تگ پایان را فراموش نکنید!!
بعضی از المان های html به درستی نمایش داده میشوند حتی اگر تگ پایان را ننویسید.
<html>
<body>
<p>This is a paragraph
<p>This is a paragraph
</body>
</html>
ولی به هیچ عنوان این کار را انجام ندهید! چون باعث خطاهای غیر منتظره میشود.
💠المان های خالی html
💢 به المان های html که هیچگونه محتوایی نداشته باشند المان های خالی میگویند.
❇تگ <br> باعث شکسته شدن خط میشود. این تگ یک المان خالی محسوب میشود و تگ پایان ندارد.
<p>This is a <br> paragraph with a line break.</p>
‼html به حروف بزرگ و کوچک حساس نیست.
💠 یعنی اینکه تگ <P> با تگ <P> هیچ فرقی ندارد.
ولی پیشنهاد ما این است که از حروف کوچک استفاده کنید.
#HTML
🖥 @Computer_MCH
✅ به نام خدا
⭕️ جلسه هفتم(مشخصه ها یا صفت ها در Html)
💠 صفت ها در Html توضیحات بیشتری درباره المان ها میدهند.
💢 همه ی المان ها در html میتوانند attribute داشته باشند.
💢 صفت ها(Attributes) همیشه در اول تگ تعریف میشوند.
🌀 href Attribute
💢 تگ <a> یک هایپرلینک را تعریف میکند. صفت href تعیین میکند که لینک تعریف شده در صفحه به کجا هدایت شود:
<a href="https://www.Google.com">Html & Css </a>
❗️ در جلسات اینده در مورد لینک ها توضیحات بیشتری به شما میدهیم.
🌀 Src Attribute
💢 تک <img> برای وارد کردن عکس در صفحه استفاده می شود. تگ Src آدرس عکس را تعیین می کند:
<img src="img_Car.jpg">
🌀 Height and Width Attribute
💢 تگ img باید شامل اتریبیوت های width و height باشد. این صفت ها طول و عرض عکس را تعیین میکنند:
<img src="img_Car.jpg" width="500" height="600">
🌀 Title Attribute
💢 این attribute اطلاعات اضافه ای را در مورد یک المان نشان میدهد. مقدار وارد شده در این اتریبیوت به عنوان یک tooltip در بالای المان نشان داده میشود:
<p title="I'm a tooltip">This is a paragraph.</p>
❗️ نکته 1: همیشه از حروف کوچک برای attribute ها استفاده کنید.
البته شما میتوانید هم از حروف کوچک استفاده کنید هم از حروف بزرگ ولی پیشنهاد ما به شما این است که از حروف کوچک استفاده کنید. مثلا به جای نوشتن TITLE بنویسید title.
❗️ نکته 2: همیشه از دابل کوتیشن استفاده کنید.
کد html به شما اجازه میدهد که از دابل کوتیشن استفاده نکنید. ولی پیشنهاد ما به شما این است که استفاده کنید.
(در آینده خواهید فهمید)
✅ <a href="https://www.google.com">Visit our HTML tutorial</a>
❌ <a href="https://www.google.com">Visit our HTML tutorial</a>
✳️ خلاصه این فصل:
⭕️ همه ی عناصر در Html میتوانند Attribute داشته باشند.
⭕️ صفت href تعیین میکند که لینک تعریف شده به کدام صفحه هدایت شود.
⭕️ صفت Src آدرس عکس را در تگ img تعیین میکند.
⭕️صفت های height و width به ترتیب طول و عرض یک شکل یا عکس را تعیین میکند.
⭕️ صفت title اطلاعات اضافه ای را در مورد تگ تعیین میکند.
⚜️ آزمون این فصل در جلسات بعد گرفته میشود.
#HTML
🖥 @Computer_MCH
⭕️ جلسه هفتم(مشخصه ها یا صفت ها در Html)
💠 صفت ها در Html توضیحات بیشتری درباره المان ها میدهند.
💢 همه ی المان ها در html میتوانند attribute داشته باشند.
💢 صفت ها(Attributes) همیشه در اول تگ تعریف میشوند.
🌀 href Attribute
💢 تگ <a> یک هایپرلینک را تعریف میکند. صفت href تعیین میکند که لینک تعریف شده در صفحه به کجا هدایت شود:
<a href="https://www.Google.com">Html & Css </a>
❗️ در جلسات اینده در مورد لینک ها توضیحات بیشتری به شما میدهیم.
🌀 Src Attribute
💢 تک <img> برای وارد کردن عکس در صفحه استفاده می شود. تگ Src آدرس عکس را تعیین می کند:
<img src="img_Car.jpg">
🌀 Height and Width Attribute
💢 تگ img باید شامل اتریبیوت های width و height باشد. این صفت ها طول و عرض عکس را تعیین میکنند:
<img src="img_Car.jpg" width="500" height="600">
🌀 Title Attribute
💢 این attribute اطلاعات اضافه ای را در مورد یک المان نشان میدهد. مقدار وارد شده در این اتریبیوت به عنوان یک tooltip در بالای المان نشان داده میشود:
<p title="I'm a tooltip">This is a paragraph.</p>
❗️ نکته 1: همیشه از حروف کوچک برای attribute ها استفاده کنید.
البته شما میتوانید هم از حروف کوچک استفاده کنید هم از حروف بزرگ ولی پیشنهاد ما به شما این است که از حروف کوچک استفاده کنید. مثلا به جای نوشتن TITLE بنویسید title.
❗️ نکته 2: همیشه از دابل کوتیشن استفاده کنید.
کد html به شما اجازه میدهد که از دابل کوتیشن استفاده نکنید. ولی پیشنهاد ما به شما این است که استفاده کنید.
(در آینده خواهید فهمید)
✅ <a href="https://www.google.com">Visit our HTML tutorial</a>
❌ <a href="https://www.google.com">Visit our HTML tutorial</a>
✳️ خلاصه این فصل:
⭕️ همه ی عناصر در Html میتوانند Attribute داشته باشند.
⭕️ صفت href تعیین میکند که لینک تعریف شده به کدام صفحه هدایت شود.
⭕️ صفت Src آدرس عکس را در تگ img تعیین میکند.
⭕️صفت های height و width به ترتیب طول و عرض یک شکل یا عکس را تعیین میکند.
⭕️ صفت title اطلاعات اضافه ای را در مورد تگ تعیین میکند.
⚜️ آزمون این فصل در جلسات بعد گرفته میشود.
#HTML
🖥 @Computer_MCH
✅ به نام خدا
⭕️ جلسه هشتم(سرصفحه ها یا Heading در Html)
💠 سرصفحه ها در html عنوان هایی هستند که شما میخواید در صفحه Html مشاهده میکنید.
💢 سر صفحه ها در Html
سر صفحه ها در Html با تگ های <h1> الی <h6> تعیین میشود
🔰 تگ <h1> بزرگترین و مهم ترین سرصفحه است. تگ <h6> کم اهمیت ترین و کوچکترین سر صفحه است.
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
💯 سر صفحه ها مهم هستند.
❗️تگ <h1> باید برای مهم ترین موضوع استفاده شود. هر چه شماره تگ ها بیشتر شود اهمیت آن کمتر میشود
❗️ موتور های جستجو برای دسته بندی ساختار وب سایت شما از سرصفحه ها استفاده میکنند.
💠 سر صفحه های بزرگتر !!!
⭕️ هر سر صفحه سایز پیش فرض خود را دارد. اگرچه شما میتوانید سایز همه ی سر صفحه هارا تغییر دهید. میتوانید این کار را به وسیله اتریبیوت Style و پراپرتی font-size انجام دهید
💢 مثال:
<h1 style="font-size:60px;">Heading 1</h1>
⚜️ آزمون این فصل در جلسه بعد گرفته میشود.
#HTML
🖥 @Computer_MCH
⭕️ جلسه هشتم(سرصفحه ها یا Heading در Html)
💠 سرصفحه ها در html عنوان هایی هستند که شما میخواید در صفحه Html مشاهده میکنید.
💢 سر صفحه ها در Html
سر صفحه ها در Html با تگ های <h1> الی <h6> تعیین میشود
🔰 تگ <h1> بزرگترین و مهم ترین سرصفحه است. تگ <h6> کم اهمیت ترین و کوچکترین سر صفحه است.
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
💯 سر صفحه ها مهم هستند.
❗️تگ <h1> باید برای مهم ترین موضوع استفاده شود. هر چه شماره تگ ها بیشتر شود اهمیت آن کمتر میشود
❗️ موتور های جستجو برای دسته بندی ساختار وب سایت شما از سرصفحه ها استفاده میکنند.
💠 سر صفحه های بزرگتر !!!
⭕️ هر سر صفحه سایز پیش فرض خود را دارد. اگرچه شما میتوانید سایز همه ی سر صفحه هارا تغییر دهید. میتوانید این کار را به وسیله اتریبیوت Style و پراپرتی font-size انجام دهید
💢 مثال:
<h1 style="font-size:60px;">Heading 1</h1>
⚜️ آزمون این فصل در جلسه بعد گرفته میشود.
#HTML
🖥 @Computer_MCH