ادامه آموزش مبحث CSS

 id و Class در CSS

همونطور که در بخش ساختار نحوی دستورات مشاهده کردین، تو بخش Selector عنصری رو که می‌خوایم استایل روی اون اعمال بشه رو ذکر می‌کنیم.

حالا اگه بخوایم دستورات استایل مورد نظر فقط روی یک عنصر در صفحه وب و یا فقط گروهی از عناصر مورد نظر ما اعمال بشه باید از id و Class استفاده کنیم.

اعمال دستورات فقط بر روی یک عنصر واحد توسط id 

برای این منظور اول باید به کدهای HTML رفته و برای عنصر مورد نظر صفت id رو تعریف کنیم. سپس به بخش دستورات CSS رفته و در بخش Selector، صفت id که برای عنصر مورد نظر تعریف کردیم رو نوشته و یک نماد “#” قبل از اون اضافه کنیم.

مثلا اگه بخوایم دستورات فقط بر روی یک پاراگراف خاص اعمال بشن، ابتدا برای اون پاراگراف یک صفت id در کدهای HTML تعریف می‌کنیم: 

       <"p id="para1 

سپس در دستورات CSS در بخش Selector مقدار صفت id تعریف شده را همراه با یک علامت “#” می نویسیم:

}para1 #
   ; text-align:center
    ; color:red
{

 

 

معرفی css

CSS چیست؟

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

تعریف css

کلمه CSS مخفف عبارت انگلیسی Cascading style sheets و به معنی ‌صفحات استایل آبشاری هست. حالا چرا آبشاری؟ چون دستورات CSS اعمال شده به هرعنصر، بر فرزندان اون عنصر هم تاثیر دارن. این مسئله رو تو مقاله‌های آینده، بیشتر متوجه می‌شیم!

چه چیزهایی باید برای یادگیری کدهای CSS بدانید؟

می‌شه گفت که تنها پیش‌نیاز برای یادگیری مفاهیم CSS، تسلط مناسبی به HTML هست.

 

  • Content (محتوا) این بخش وب به وسیله کد های HTML ایجاد می‌شه.
  • Presentation (نمایش) این بخش وب به وسیله کد های CSS ایجاد می‌شه.
  • Behavior (رفتار) این بخش وب به وسیله  JavaScript ایجاد می‌شه.

 

  در تصویر زیر میتونید HTML رو بدون داشتن کد های CSS مشاهده کنید.😀😊

برای مطالعه ادامه مطالب کلیک بفرمایید..

صفت عناصر در html

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

هر صفت از دو بخش اصلی تشکیل می شود :

Name: نام صفت را تعیین می کند.

Value :مقداری که برای صفت تعریف می شود.

<"label name="value>

شکل کلی تخصیص صفت های یک عنصر

<"مقدار"= نام صفت دوم  "مقدار" = نام صفت اول  نام عنصر >

محتوای عنصر
<نام عنصر/>
ادامه مطلب

 

عنصر body

عنصر body در حقیقت بدنه اصلی صفحه html را برای ما معرفی می‌کند . همه کد هایی که برای تعیین محتوای صفحه مورد نیاز است در بین برچسب های شروع و پایان عنصر body قرار می گیرند. فقط محتویات این قسمت توسط مرورگر به عنوان خروجی نمایش داده می‌شوند.

شکل کلی عنصر body

<"مقدار"=body dir>

متن و محتویات صفحه وب

 

صفت dir در عنصر body برای تعیین جهت متن به صورت راست به چپ یا برعکس به کار می‌رود.

صفت bgcolor رنگ زمینه صفحه وب را تغییر می‌دهد و صفت text رنگ پیش فرض متن های درون صفحه را تعیین می کند.

مبحث html

عبارت HTML سرواژه های  Hyper Text Language و یک زبان نشانه گذاری برای توصیف اسناد وب است. ببشتر صفحات وب با « زبان نشانه گذاری ابر متن» html تولید میشوند.

هر یک از عناصر html معنی خاصی را دارند  و تاثیر مشخصی بر محتوا می گذارند. این عناصر به وب اعلام می کنند که هر بخش باید به چه صورت نمایش داده شود. ادامه مطلب

 

هر عنصر html معمولا شامل یک بخش ابتدایی ، یک بخش انتهایی و محتویات عنصر است.

<برچسب انتها/> محتویات <برچسب ابتدا>

 ادامه مطلب..

Charset

کارکتر ست یا Charset چیست؟

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

به عنوان مثال کارکتر ست ASCII تمامی حروف انگلیسی را پوشش می‌دهد و با استفاده از این کارکتر ست از حروف انگلیسی به صورت کامل استفاده کنید، اما اگر بخواهید از زبان های دیگر استفاده کنید، باید از کارکتر ست دیگری به نام Unicode استفاده کنید که تمامی زبان های زنده جهان را پشتیبانی می‌کند.

با استفاده از UTF-8 شما می‌توانید از داده های ۸ بیت تا ۳۲ بیت استفاده کنید، ولی در UTF-16 از داده های ۱۶ بیت و ۳۲ بیت می‌توانید استفاده کنید و داده های کوچکتر صرف نظر می‌شوند.

<"meta charset="UTF-8>