এসসিএসএস মেশিনে / অন্য অবস্থার জন্য সিনট্যাক্স


106

হাই আমি SASS / এসসিএসএস শেখার চেষ্টা করছি এবং ক্লিয়ারফিক্সের জন্য আমার নিজের মিশ্রণটি রিফ্যাক্টর চেষ্টা করছি

আমি মিশ্রিনটি প্রস্থটি পাস করি কিনা তার উপর ভিত্তি করে আমি কী চাই।

এখন পর্যন্ত চিন্তাভাবনা (সিউডো কোডটি কেবলমাত্র আমি অন্যান্য মিশ্রণগুলি সহ অন্তর্ভুক্ত করব)

@mixin clearfix($width) {

   @if !$width {

    // if width is not passed, or empty do this

   } @else {

        display: inline-block;
        width: $width;
   }
}

এখানে আমি কীভাবে ভেবেছিলাম আমি এটি কল করতে পারি তবে এটি কার্যকর নয়।

@include clearfix();

অথবা

@include clearfix(100%)

অথবা

@include clearfix(960px)

আমি এটি করার জন্য সর্বোত্তম বা সঠিক উপায়ে যেকোন সাহায্যের প্রশংসা করব!


3
দয়া করে রায়ান জেমসের উত্তর দেখুন - এটি বর্তমানে গৃহীত উত্তরগুলির চেয়ে অনেক ভাল। =)
কুইন স্ট্রহল

উত্তর:


145

আপনি এটি চেষ্টা করতে পারেন:

$width:auto;
@mixin clearfix($width) {

   @if $width == 'auto' {

    // if width is not passed, or empty do this

   } @else {
        display: inline-block;
        width: $width;
   }
}

আমি আপনার পছন্দসই ফলাফল সম্পর্কে নিশ্চিত নই, তবে একটি ডিফল্ট মান নির্ধারণ করে মিথ্যা ফিরে আসা উচিত।


5
এটি করে, আপনাকে ধন্যবাদ দিয়ে আমার এটি ব্যবহার করা হয়েছে " "তবে আমি অটোর মান আরও ভাল পছন্দ করি :) - পরিবর্তনশীল সেট করার দরকার ছিল না যদিও আমি মিক্সিন সিনট্যাক্সটিতে এটি ডিফল্ট ভৌই হিসাবে @mixin clearfix($width: auto) {... ধন্যবাদ রেখেছি :)
ক্লায়ারসুজি

$ প্রস্থ দেওয়ার জন্য কোনও উদ্দেশ্য: অটো; ডিফল্ট মান হিসাবে?
ক্রিশ

222

আপনি যখন প্রথম মিক্সিনটি তৈরি করেন আপনি ডিফল্ট প্যারামিটার মানগুলিকে ইনলাইন নির্ধারণ করতে পারেন:

@mixin clearfix($width: 'auto') {

  @if $width == 'auto' {

    // if width is not passed, or empty do this

  } @else {

    display: inline-block;
    width: $width;

  }
}

23
এটি গ্রহণযোগ্য উত্তর হওয়া উচিত! ডিফল্ট প্যারামিটার ব্যবহার করা আরও ভাল / ক্লিনার।
গ্রাফিকাল

@ হেলাফন্ট: দয়া করে অবৈধ সম্পাদনাগুলি যুক্ত করবেন না। কোড যুক্ত করা বা এটি পরিবর্তন করা একটি উত্তরের অর্থ পরিবর্তন করবে। একটি মন্তব্য যথেষ্ট হবে।
ব্রায়ান

9

আপনি প্যারামিটারটি ডিফল্ট করতে পারেন nullবা false
এইভাবে, পরীক্ষা করা আরও ছোট হবে যদি প্যারামিটার হিসাবে কোনও মান পাস করা হয়।

@mixin clearfix($width: null) {

  @if not ($width) {

    // if width is not passed, or empty do this

  } @else {

    display: inline-block;
    width: $width;

  }
}

সবচেয়ে কম আপোভেট সহ সর্বাধিক যৌক্তিক উত্তর ... বিশ্বটি অযৌক্তিক।
সিপিএইচপিথন
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.