تگ گروه بندی Fieldset , Legend

تگ fieldset برای دسته بندی چندین کنترل و برای تعیین عنوان یک گروه از تگ Legend در ابتدای تگ Fieldset استفاده می گردد. تگ Fieldset برای گروه بندی در فرم ها بسیار کاربرد دارد.

<fieldset>
   <legend>عنوان گروه</legend>
   <p>متن آزمایشی شماره یک</p>
   <p>متن آزمایشی شماره دو</p>
</fieldset>
عنوان گروه

متن آزمایشی شماره یک

متن آزمایشی شماره دو

مهم ترین خصوصیت Legend خصوصیت Align یا تراز می باشد که محل قرار گیری عنوان را مشخص میکند.

مقدار هایی که این خصوصیت می پذیرد عبارتند از : Top , Bottom , Left , Right

<fieldset>
   <legend align="left">عنوان گروه</legend>
   <p>متن آزمایشی شماره یک</p>
   <p>متن آزمایشی شماره دو</p>
</fieldset>

تگ img

برای استفاده از تصاویر در برگه‌های وب شما باید از تگ img در HTML استفاده کنید که این تگ یک تگ Self Closing است(تگ پایانی برای بسته شدن ندارد).

این تگ یکی از مهمترین و پر استفاده ترین تگ ها در HTML می باشد و با استفاده از آن می توان عکس دلخواهی را در صفحه ی HTML قرار داده و با اندازه و شکل دلخواه نمایش داد.

این تگ دارای خاصیتی تحت عنوان src می باشد که این خاصیت در واقع مخفف کلمه source است و مقدار ورودی آن تعیین کننده عکسی است که می‌خواهید آن را نمایش دهید.

خاصیت بسیار مهم دیگری که در این تگ وجود دارد و باید حتما از آن استفاده شود، خاصیت alt است. alt مخفف کلمه alternative است و در هنگام بارگئاری نشدن تصویر به هر دلیلی متن داخل آن نمایش داده می شود.

بصورت پیش فرض تگ img نمایش عکس ها را به اندازه ی اصلی و پیش فرض عکس و بدون خط حاشیه نمایش میدهد. در صورتی که بخواهید تصویر را در سایز دلخواه و با خط حاشیه نمایش دهید از خصوصیات width , height , border استفاده می کنیم.

<img src="UploadFile/images/pic1.jpg" alt="عنوان عکس"  width="100"    height="100" border="2" />

تگ لینک (a)

برای ایجاد لینک باید از تگ a استفاده کرد، a ابتدای کلمه anchor به معنای لنگر است. تگ لینک برای ارتباط بین صفحات وب و یا ایجاد لنگر در داخل صفحه، در سایت به کار میرود.

مهمترین خصوصیات این تگ به شرح زیر می باشد :

  • href : مشخص می کند در صورت کلیک شدن بر روی لینک چه صفحه ای باز شود
  • title : برای ایجاد توضیحی که با بردن موس روی لینک به نمایش در می آید و برای آن به کار می رود که کاربر قبل از کلیک بداند به کجا هدایت خواهد شد
  • target : که طریقه ی باز شدن لینک در مرورگر را مشخص می کند و در آن مشخص می کنیم که صفحه ای که به آن لینک کردیم می خواهیم که در همین صفحه باز شود(self_) یا در تب جدیدی یا پنجره جدیدی در مرورگر(blank_) باز شود.
  •  
<a href="http://www.google.com" target="_blank" title="موتور جستجوی گوگل"></a>

سیستم رنگ‌بندی در HTML

در HTML راه‌های مختلفی برای استفاده از رنگ‌ها وجود دارد :

  1. نام رنگ‌ها
  2. استفاده از سیستم Hexadecimal
  3. استفاده از RGB
  4.  
نحوه ایجاد طرح بندی و ساخت لایه های وب سایت در فتوشاپ
شاید این مطلب را نیز بپسندید

نام رنگ‌ها

استفاده از نام رنگ ها یک روش ساده اما محدود برای سیستم رنگ‌بندی است. به این صورت که اگر شما به رنگ آبی نیاز داشته باشید کافی‌ است نام آن را بنویسید(blue).

 <h1 style="color:blue;">Simple Text</h1>

در این مدل ما دسترسی به طیف های مختلف هر رنگ نداریم و میزان غلظت آن ها را نمی توانیم کم یا زیاد کنیم.

استفاده از سیستم Hexadecimal

در این مدل، اعداد به ما این قابلیت را می‌دهد تا کمی بیشتر از ۶ میلیون رنگ را استفاده کنیم. استفاده از این سیستم بسیار آسان است. در یک سیستم ۱۶تایی از اعداد ما با اعداد ۰ تا ۹ و a تا f سر و کار داریم. ما در این مدل قابلیت ترکیب رنگی سه رنگ اصلی یعنی Red Green Blue یا قرمز سبز آبی را داریم.

برای مقدار دهی به میزان هرکدام از این رنگ‌ها ما می‌توانیم از اعداد سیستم ۱۶ تایی استفاده بکنیم. مقدار f یعنی حداکثر میزان از آن رنگ و مقدار ۰ یعنی خالی از آن رنگ در ترکیب رنگ بندی مورد نظر ما است.

 <h1 style="color:#5547ff;">Simple Text</h1>

در سیستم رنگ‌دهی هگزادسیمال ۶ عدد وجود دارد که هر دو عدد از سمت چپ نمایانگر یک رنگ از سه رنگ اصلی(قرمز ، سبز ، آبی) هستند. از سمت چپ به راست، دو عدد اول قرمز، دو عدد میانی سبز و دو عدد آخر آبی هستند. وقتی که مقدار دو عدد اول ۰۰ باشد به این معناست که رنگ قرمز وجود ندارد، برای دو عدد میانی نیز به همین صورت، اما وقتی دو عدد آخر برابر ff (حالت حداکثر) باشد به این معنی است که رنگ برابر با آبی می باشد.

استفاده از RGB

در سیستم رنگ‌بندی RGB دقیقا همان فلسفه مورد قبلی پیاده‌سازی می‌شود، با این تفاوت که سیستم عدد گذاری در این حالت متفاوت است. در این سیستم ما از اعداد بین ۰ تا ۲۵۵ استفاده می‌کنیم.

 <h1 style="color:rgb(13,23,255);">Simple Text</h1>

در برخی سیستم‌های رنگ‌بندی ما می‌توانیم یک گزینه یا پارامتر دیگر را نیز تنظیم کنید. این پارامتر میزان شفافیت یا Opaciy است. این مقدار عددی بین ۰ تا ۱ است. این مقدار به صورت پیشفرض برابر با ۱ است اما می‌توانید آن را تا حدی کاهش دهید که کاملا المان شما محو شود. برای مثال اگر این مقدار برابر ۰ باشد هیچ چیزی در صفحه مشاهده نمی‌شود. برای اینکار نیاز است که حرف a را به انتهای rgb اضافه کنید و همچنین یک مقدار چهارم در پرانتز قرار دهید.

  <h1 style="color:rgba(13,23,255,0.5);">Simple Text</h1>
آموزش Html(بخش ششم)