1. مهمان گرامی، جهت ارسال پست، دانلود و سایر امکانات ویژه کاربران عضو، ثبت نام کنید.
    بستن اطلاعیه

یک ترفند ساده برای اشکال زدایی outdent :CSS کردن خصیصه ها

شروع موضوع توسط minaaa ‏9/2/14 در انجمن CSS

  1. کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,795
    تشکر شده:
    6,456
    امتیاز دستاورد:
    113
    [​IMG] سی اس اس

    [h=1]یک ترفند ساده برای اشکال زدایی outdent :CSS کردن خصیصه ها[/h]

    حتما بارها برای شما هم پیش آمده است که با هدف یادگیری بیشتر و یا شاید اشکال زدایی کدها، سی اس اسی را که نوشته اید کمی دستکاری کنید. شاید بخواهید مقادیر برخی خصیصه ها را تغییر دهید یا مقادیر جدیدی را جایگزین مقادیر قبلی کنید. معمولا در پایان این فرآیند انبوهی از propertyهای جدید مثل رنگ های پس زمینه عجیب و غریب، borderهای متنوع، فونت های جایگزین و بسیاری خصیصه های دیگر را به سی اس اس خود افزوده اید تا نتیجه دلخواهتان را کسب کنید و همه چیز را با هم هماهنگ تر کنید. حال می خواهید کار خود را تمام کنید، اما از سوی دیگر تمایل دارید تا دفعه بعد که به سراغ فایل خود بر می گردید، تغییراتی را که انجام داده اید به راحتی تشخیص دهید. در چنین مواقعی چه می کنید؟ مطمئنا هر دولوپری تکنیک ها و روشهای خاص خود را استفاده می کند، با اینحال در این مطلب نردبان قصد داریم تکنیک ساده ای را به شما آموزش دهیم که در چنین مواقعی می تواند نیاز شما را برطرف سازد.

    روشی بسیار ساده و آسان: outdent کردن خصیصه اضافه شده.


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


    • .nardebaan{
    • background:url(/images/nardebaan.jpg) no-repeat;border:2px solid green;
    • height:200px;
    • left:20px;
    • top:20px;
    • position:absolute;
    • width:300px; z-index:10;
    • }



    زمانی که استایل های خود را به این صورت فرمت دهی کنید، مرتبه بعد که به فایل خود رجوع می کنید تا تغییرات را بررسی نهایی کنید و بعد از آن بتوانید آن را به یک سیستم کنترل ورژن (مثل VCS) بدهید، تشخیص خصیصه مورد نظر به آسانی امکان پذیر است. با استفاده از outdent کردن خصیصه ها، آنها از لحاظ بصری به اندازه کافی واضح می مانند تا بعدا بتوانید آنها را در سی اس اس خود پیدا کنید.


    برخی اوقات اضافه کردن یک property به تنهایی نمی تواند روش اشکال زدایی مناسبی باشد. شما در چنین مواقعی ممکن است بخواهید که مقدار یک خصیصه را override کنید و البته برای خودتان ردپایی به جا بگذارید تا وقتی برگشتید بتوانید آن را تشخیص دهید. اگر با مفاهیم CSS Specificity آشنایی داشته باشید، حتما می دانید وقتی دو مقدار پشت سر هم به یک خصیصه نسبت داده شوند، مقدار دوم ارزش بالاتری داشته و به عنوان مقدار آن خصیصه لحاظ می شود. استفاده از تکنیک outdenting در چنین زمان هایی هم کارساز است. می توانید مقدار اولیه را باقی بگذارید و سپس مقدار جدید را به صورت outdent شده زیر آن قرار دهید. حال به راحتی در سی اس اس خود می توانید مقدار اولیه و تغییری را که در آن ایجاد کرده اید به راحتی بیابید و پس از اطمینان از درستی آن مقدار صحیح را باقی بگذارید.


    • .nardebaan{
    • background:url(/images/nardebaan.jpg) no-repeat;
    • height:200px;
    • left:20px;
    • top:20px;top:100px;
    • position:absolute;
    • width:300px;
    • z-index:10;
    • }


    البته شاید شما ترجیح دهید با کامنت کردن property اول همین کار را انجام دهید. مطمئنا این هم روش درستی است، اما به تجربه ثابت شده است که دندانه دار کردن استایل ها روش سریع تری برای تمیزکاری سی اس اس پس از اعمال تغییرات در آن است.