آموزش مقدار initial در CSS

این رو بطور کلی بدونید که هر یک از تگ ها ( یا عناصر ) زبان HTML دارای یکسری دستورات CSS پیش فرض می باشند که این دستورات CSS پیش فرض دقیقا لحظه متولد شدن ( تولید شدن یا درست شدن ) این عناصر بهشون اختصاص داده شده است.

یعنی اگر مثلا شما از تگ P استفاده نمایید خب همانطور که گفتم این تگ یسری دستورات CSS پیش فرض داره و در نتیجه مرورگرها خودشون دیگه بصورت اتوماتیک این دستورات CSS پیش فرض رو روی این تگ ها اعمال میکنند.

در بخش آموزش تگ های HTML ، در پایان آموزش هر تگ شما میتونید دستورات CSS پیش فرض اون تگ رو مشاهده نمایید، و اگه تگی این دستورات رو نداشت خب یعنی اون تگ دستورات CSS پیش فرض ندارد.

ما میتونیم خودمون به راحتی این دستورات CSS پیش فرض رو تغییر بدیم، چجوری تغییر بدیم؟ کافیه اون ویژگی رو با مقدار جدیدی که مدنظر خودمونه ایجاد نماییم.

مثال شماره ۱ : مشاهده دستورات CSS پیش فرض تگ P – تگ پاراگراف یا P بصورت پیش فرض دستورات CSS زیر را دارد.

p {
 display: block;
 margin-top: 1em;
 margin-bottom: 1em;
 margin-left: 0;
 margin-right: 0;
}

p {

display: block;

margin-top: 1em;

margin-bottom: 1em;

margin-left: 0;

margin-right: 0;

}

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

مثال شماره ۲ : نحوه تغییر دستورات CSS پیش فرض یک تگ – در مثال زیر میخواهم دستورات CSS پیش فرض تگ P را به دلخواه خودم تغییر بدم.

<style>

p {
 display: block;
 margin-top: 3em;
 margin-bottom: 3em;
 margin-left: 3em;
 margin-right: 3em;
 background-color:#f2f2f2;
 padding:15px;
}

</style>

<style>

p {

display: block;

margin-top: 3em;

margin-bottom: 3em;

margin-left: 3em;

margin-right: 3em;

background-color:#f2f2f2;

padding:15px;

}

</style>

امتحان کنید

همانطور که مشاهده مینمایید در مثال بالا ما به راحتی میتوانیم دستورات CSS پیش فرض یک تگ را به دلخواه خودمون تغییر بدهیم.

Free-Learn

مثال از مقدار initial در CSS

خب حالا مقدار initial چیه یعنی چی؟ این کلمه در لغت به معنای ( اولیه هس ) یعنی منظورش همون دستورات اولیه یا دستورات پیش فرضی که موقع تولدش بهش داده شده و مرورگرها بصورت پیش فرض اون تگ رو با دستورات CSS پیش فرضش نمایش میدن.

حال ما در CSS به راحتی میتوانیم مقدار یک ویژگی را در حالت initial قرار بدهیم، یعنی مثلا بگیم فلان ویژگی مقدارش همان مقدار اولیه خودش باشد.

در مثال زیر بطور کامل نحوه استفاده از مقدار initial را متوجه خواهید شد.

<style>

div{
 color:blue;
}

div h2{
 color:initial;
}

</style>

<style>

div{

color:blue;

}

div h2{

color:initial;

}

</style>

امتحان کنید

توضیح مثال بالا : خب در مثال بالا من گفتم رنگ متن تگ DIV آبی باشه خب، بعدش گفتم تگ H2 که درون تگ DIV هس رو رنگ متنش رو بزار همون مقدار اولیه یا در واقع همون مقدار پیش فرض خودش باشه.

خب در حالت عادی طبیعتا وقتی من گفتم تگ DIV رنگ متنش آبی باشه اونم هرچی که داخل تگ DIV باشه رو رنگ متنش رو آبی میکنه ولی خب دیگه ما اینجا از مقدار initial استفاده کردیم پس رنگ متن H2 رنگ پیش فرض خودش میشه، که رنگ پیش فرض تگ های HTML هم رنگ مشکی هس.