آموزش طراحی سایتآموزش HTML

تگ style در HTML

استایل بندی درون صفحه ای با تگ style

تگ style چیست؟‌ چگونه در صفحات html استایل بندی کنیم؟ در این مقاله به صورت کامل با تگ style که کاملا مربوط به CSS می‌شود آشنا می‌شویم.

تگ Style

تگ <style> برای تعیین اطلاعات استایل در یک سند HTML مورد استفاده قرار می گیرد. در داخل این تگ شما تعیین می کنید عناصر HTML چگونه و با چه استایلی در مرورگر نمایش داده شود. به طور کلی استفاده از تگ style زمانی است که می‌خواهیم به صورت داخلی کدهای css خود را در صفحات html معرفی کنیم.

هر سند HTML می تواند حاوی چندین تگ style باشد.

مثال

در مثال زیر ما تگ <style> را درون تگ head قرار داده ایم که یک نمونه از استفاده از این تگ می‌باشد. با اینحال شما می‌توانید از این تگ در بخش body صفحه خود نیز استفاده کنید.

<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>

<h1>A heading</h1>
<p>A paragraph.</p>

</body>
</html>

می‌بینید که در مثال بالا تگ h1 به رنگ قرمز و تگ p رنگ آبی در آمده است و همانطور که گفتیم، این بخش با کد های CSS تکمیل می‌شود، برای یادگیری CSS‌ پیشنهاد می‌کنم که مقالات آموزش CSS ما در میزفا را بخوانید.

خاصیت های تگ style

در جدول زیر خاصیت های اختصاصی تگ style را می‌بینید.

خاصیتمقدارتوضیحات
Mediaکوئری مدیاتعیین کننده نوع دستگاه یا رسانه ای که منبع رسانه ای برای بهینه سازی مورد استفاده قرار می گیرد
TypeText/cssتعیین کننده نوع رسانه تگ <style>

این تگ با توجه به اینکه به صورت پنهان از دید کاربران است نیازی به استفاده از خاصیت های عمومی ندارد، با اینحال از خاصیت های عمومی و رویدادی (Event) پشتیبانی می‌کند. (البته بازم میگم طبق کاربرد این تگ اصلا نیازی به بیشتر خاصیت های عمومی و رویدادی ندارید ولی با این حال پشتیبانی می‌کنند دیگه… باز اگر به عنوان یک متخصص دارید لطف میکنین و مقاله من رو میخونید، اگر من اشتباه میکنم بگید که اصلاحش کنیم …)

نتیجه گیری

توضیحاتی اولیه در رابطه با تگ style در این مقاله خواندیم و با آن آشنا شدیم. نوید معدن نژاد عزیز ، در آموزش های CSS خودش یک مقاله کامل در رابطه اتصال داخلی کد‌های CSS نوشته است که از نظر پیاده سازی و مزایا و معایب این نوع اتصال را بررسی کرده است، با توجه به استفاده از تگ style برای اتصال داخلی کد‌های CSS پیشنهاد می‌کنم ، این مقاله را بررسی کنید.

این مقاله نیز به پایان رسید، مثل همیشه اگر سوال، پیشنهاد یا انتقادی داشتین، منتظرشون خواهم بود و قول میدم که در اولین فرصت بهشون پاسخ بدم. تا مقاله بعدی فعلا…

برچسب ها

علی اسمعیلی

درباره خودم گفتن یا نوشتن کار آسونی نیست. باید تو کم‌ترین حجم مهم‌ترین اطلاعات رو بنویسی. وقتی که اولین بار دستم به کیبورد خورد، ۶ سالم بود. حس جالبی بود؛ زندگیم شده بود ۴ تا کلید WASD روی کیبورد کامپیوتر برای کنترل ماشین. از ۱۰ سالگی که مادرم با فوتوشاپ کار می‌کرد کنارش نشستم و یاد گرفتم. ۱۳ سالم بود که اولین وب‌سایتم رو با پی اچ پی نیوک ایجاد کردم. تا الان وب سایت‌های زیادی رو شروع کردم و شاید به خاطر اینکه هدف تجربه کردن رو داشتم شکست خوردند. موفق‌ترین پروژه شکست خوردم رو می‌تونم اوکسو معرفی کنم که شاید اسمش رو شنیده باشید. الانم دارم کار‌هایی رو شروع می‌کنم چون با خودم عهد کرده بودم که تا بیست سالگی جاهای مختلفی کار کنم و تجربه کنم و بعد از تجربیاتم استفاده کنم. بعد از رسیدن به بیست سالگی خوشحالم که یکی از تجربیات خوبم همکاری با میزفاست و دارم ادامش میدم...

نوشته های مشابه

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *


حداکثر حجم فایل برای آپلود: 1 MB.
فایل‌های مجاز برای آپلود: عکس, ویس, ویدیو, ورد یا پی دی اف, فایل متنی, زیپ.
شما می‌تونید برای بهتر پرسیدن سوالتون، عکس یا ویس یا حتی فیلم در بخش نظرات میزفا آپلود کنید. برای ضبط ویس می‌تونید از خود واتس آپ استفاده کنید و بعد اینجا آپلود کنید و برای ارسال عکس هم کافی هست اسکرین شات بگیرید.

همچنین ببینید

بستن
دکمه بازگشت به بالا
سایت خود را در گوگل مدیریت کنید + ۱۵ ساعت فیلم آموزشیجزئیات بیشتر اینجا کلیک کنید
بستن
با موفقیت ثبت شد، میزفا از شما برای عضویت در خبرنامه هفتگی تشکر میکند.

عضویت در خبرنامه هفتگی برای دریافت:

  • فیلم و مقاله رایگان سئو
  • آموزش‌های UX ، GA و GTM
  • مقاله های تخصصی ASP.NET Core
  • اطلاع رسانی از محصولات
ترک میزفا خوب نیست!
دوره سئو، رایگان شد.
فرصتی رایگان برای یادگیری
کاراکتر اشاره گر
دوره سئو، رایگان شد.
فرصتی رایگان برای یادگیری
کاراکتر اشاره گر