कम - VoidCC

116

में तारों को जोड़ना मुझे लगता है कि यह संभव नहीं है, लेकिन मैंने सोचा कि अगर कोई रास्ता है तो मैं पूछता हूं। विचार मैं वेब संसाधन फ़ोल्डर के लिए पथ के लिए एक चर राशि है जो:कम

@root: "../img/"; 
@file: "test.css"; 
@url: @[email protected]; 

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

मैं एक परिणाम के रूप में इस मिल:

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

लेकिन, मैं एक स्ट्रिंग इस तरह में गठबंधन करने के लिए तार हैं:

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

क्या कम से कम तारों को एक साथ जोड़ना संभव है?

स्रोत

2012-04-21 juminoz

201

उपयोग Variable Interpolation:

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

पूर्ण कोड:

अगर आप (WordPress के लिए WP-Less प्लगइन की तरह) less.js या lessphp का उपयोग कर रहे

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

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

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

स्रोत

2012-04-21 05:18:39 Paulpro

उत्तर के लिए धन्यवाद! यह पूर्ण है। अब मैं यह सुनिश्चित कर सकता हूं कि संदर्भ पथ में परिवर्तन होने पर भी, एक रिफैक्टरिंग दुःस्वप्न नहीं होगा। – juminoz

धन्यवाद, मैं बस एक ही समस्या में आया और दस्तावेज़ों में चूक गया। – David

धन्यवाद @Paulpro! मुझे वीएस वेब कंपाइलर ऐड-ऑन के साथ कोई समस्या हो रही थी, जहां यह मेरी पृष्ठभूमि-छवि यूआरएल बदल रहा था, और मुझे यह भी सुनिश्चित नहीं था कि कॉन्सटेनेशन कैसे करें :) –

पता नहीं है लेकिन साथ lessphp आप कर सकते हैं " unquote "~ के साथ स्ट्रिंग्स: http://leafo.net/lessphp/docs/#string_unquoting

स्रोत

2012-04-21 05:19:27 FelipeAls

यह नियमित रूप से कम से कम काम करता है। मुझे नहीं पता कि 2012 में यह जवाब कब लिखा गया था। – trysis

-7

ड्रूपल 7 का उपयोग करना। मैंने सामान्य प्लस मार्क का उपयोग किया है और यह काम कर रहा है:

@images_path+'bg.png'

स्रोत

2013-02-14 12:47:56 Gaba

जब तक वह कम से कम/सीएसएस में इसका उपयोग करने के लिए कॉन्सट स्ट्रिंग्स के लिए ड्रूपल को स्वेच्छा से सीखने के लिए तैयार नहीं है, मुझे लगता है कि आपका सुझाव बेकार है। कोई अपराध नहीं, मैं बस कह रहा हूँ। – ozanmuyes

मैं छवियों को संभालने के लिए एक ही चाल की तलाश में था। मैं इस जवाब देने के लिए एक mixin प्रयोग किया है:

.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"); 
}

स्रोत

2013-08-28 13:20:35 user2725509

हैलो और आपका स्वागत है! आप क्यों सोचते हैं कि स्वीकृत उत्तर अब मान्य नहीं है? क्या यह पुराना है? क्या तकनीकी सुधार हुआ है? यह गलत है? तुम्हारा बेहतर क्यों है? –

आप documentation में देख सकते हैं, आप स्ट्रिंग प्रक्षेप भी साथ उपयोग कर सकते हैं परिवर्तनीय और सादे तार एक साथ:

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

स्रोत

2013-10-18 15:32:30

उन स्ट्रिंग-जैसी इकाई मानों के लिए 45degtransform: 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);

स्रोत

2015-11-19 02:31:15 jordanb

तकनीकी रूप से सवाल का जवाब नहीं देता है, लेकिन फिर भी एक उपयोगी चाल है। – trysis

कम

उत्तर

संबंधित मुद्दे