কম মধ্যে সংঘবদ্ধ স্ট্রিং


129

আমি মনে করি এটি সম্ভব নয়, তবে আমি ভেবেছিলাম কোনও উপায় থাকলে আমি জিজ্ঞাসা করি। ধারণাটি হ'ল ওয়েব রিসোর্স ফোল্ডারে যাওয়ার পথে আমার একটি পরিবর্তনশীল রয়েছে:

@root: "../img/";
@file: "test.css";
@url: @root@file;

.px {
    background-image: url(@url);
}

আমি ফলাফল হিসাবে এটি পেতে:

.px { background-image: url("../img/" "test.css"); }

তবে, আমি চাই যে স্ট্রিংগুলি একটি স্ট্রিংয়ের সাথে একত্রিত হোক:

.px { background-image: url("../img/test.css"); }

কমগুলিতে একসাথে স্ট্রিংগুলি যুক্ত করা কি সম্ভব?

উত্তর:


225

চলক ইন্টারপোলেশন ব্যবহার করুন :

@url: "@{root}@{file}";

সম্পূর্ণ কোড:

@root: "../img/";
@file: "test.css";

@url: "@{root}@{file}";

.px{ background-image: url(@url); }

উত্তর করার জন্য ধন্যবাদ! এটি নিখুঁত। এখন আমি নিশ্চিত করতে পারি যে প্রসঙ্গের পথটি পরিবর্তিত হলেও, একটি রিফ্যাক্টরিং দুঃস্বপ্ন হবে না।
— জুমিনোজ

ধন্যবাদ, আমি ঠিক একই সমস্যাটি পেরেছি এবং ডক্সে এটি মিস করেছি।
— ডেভিড

ধন্যবাদ @ পলপ্রো! আমার ভিএস ওয়েব সংকলক অ্যাড-অনের সাথে একটি সমস্যা ছিল, যেখানে এটি আমার ব্যাকগ্রাউন্ড-চিত্রের ইউআরএল পরিবর্তন করছে, এবং আমি কীভাবে সংক্ষিপ্তকরণ করব তা নিশ্চিত ছিল না :)
— হাটস্রুমন্ডকোড

6
শুধু যারা এই উত্তর অবতরণ পারে কিন্তু এটি ব্যবহার করতে যেমন মত একটি স্ট্রিং সঙ্গে একটি সাংখ্যিক পরিবর্তনশীল একত্রিত করার চেষ্টা করছেন জন্য একটা নোট pxবা %: আপনি দ্বারা স্ট্রিং আন-মূল্যউদ্ধৃতি পারেন একটি টিল্ড সঙ্গে এটি প্রাক মুলতুবী ~, যেমন:width: ~"@{w}px";
— AsGoodAsItGets

29

আপনি ডকুমেন্টেশনে দেখতে পাচ্ছেন , আপনি এক সাথে ভেরিয়েবল এবং প্লেইন স্ট্রিংগুলির সাথে স্ট্রিং ইন্টারপোলেশন ব্যবহার করতে পারেন:

@base-url: "http://assets.fnord.com";
background-image: url("@{base-url}/images/bg.png");

12

আমি চিত্রগুলি পরিচালনা করার জন্য একই কৌশলটি খুঁজছিলাম। আমি এর উত্তর দিতে একটি মিশ্রণ ব্যবহার করেছি:

.bg-img(@img-name,@color:"black"){
    @base-path:~"./images/@{color}/";
    background-image: url("@{base-path}@{img-name}");
}

তারপরে আপনি ব্যবহার করতে পারেন:

.px{
    .bg-img("dot.png");
}

অথবা

.px{
    .bg-img("dot.png","red");
}

হ্যালো এবং স্বাগতম! আপনি কেন মনে করেন যে গৃহীত উত্তরটি আর বৈধ নয়? এটা কি পুরানো? প্রযুক্তি উন্নতি হয়েছে? এটা ভুল? তোমার ভাল কেন?
— STT LCU

9

ঐ স্ট্রিং মত ইউনিট মত মানের জন্য 45degএ transform: rotate(45deg)ব্যবহার unit(value, suffix)ফাংশন। উদাহরণ:

// Mixin
.rotate(@deg) {
  @rotation: unit(@deg, deg);
  -ms-transform: rotate(@rotation);
  transform: rotate(@rotation);
}

// Usage
.rotate(45);

// Output
-ms-transform: rotate(45deg);
transform: rotate(45deg);

1
প্রযুক্তিগতভাবে প্রশ্নের উত্তর দেয় না, তবে এখনও একটি দরকারী কৌশল।
— ট্রাইসিস

7

আপনি কম.জেএস বা লেটারফপি ব্যবহার করছেন কিনা তা জানেন না (যেমন ওয়ার্ডপ্রেসের জন্য ডাব্লুপি- লেসার প্লাগইনে) তবে লেটফ্যাপের সাহায্যে আপনি স্ট্রিংগুলিকে "আনকোট" করতে পারেন ~: http://leafo.net/lessphp/docs/#string_unquoting


1
এটি নিয়মিত কম ব্যবহার করে। আমি জানি না যে 2012 সালে এই উত্তরটি কখন লেখা হয়েছিল did
— ট্রাইসিস

-7

ড্রুপাল Using ব্যবহার করে I've. আমি একটি সাধারণ প্লাস চিহ্ন ব্যবহার করেছি এবং এটি কাজ করছে:

@images_path+'bg.png'

5
অল্প / সিএসএসে কেবল কনক্রিট স্ট্রিংয়ের জন্য তিনি স্বেচ্ছায় দ্রুপাল শিখতে না পারলে আমি মনে করি আপনার পরামর্শটি মূল্যহীন। কোন অপরাধ নেই, আমি শুধু বলছি।
— ওজনমুয়েজ
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.