/ / एचएएमएल के साथ फाउंडेशन के तुल्यकारक का उपयोग - ज़र्ब-फाउंडेशन, हैमल, नींव-तुल्यकारक

एचएएमएल - ज़र्ब-फाउंडेशन, हैमल, फाउंडेशन-तुल्यकारक के साथ फाउंडेशन के तुल्यकारक का उपयोग करना

मैं दो स्तंभों को एक ही ऊंचाई बनाने के लिए ज़र्ब के फाउंडेशन तुल्यकारक का उपयोग करने की कोशिश कर रहा हूं।

फाउंडेशन वेबसाइट के अनुसार वाक्यविन्यास:

<div class="row" data-equalizer>
<div class="large-6 columns panel" data-equalizer-watch>
...
</div>
<div class="large-6 columns panel" data-equalizer-watch>
...
</div>
</div>

मैं इसे हामल में कैसे अनुवाद करूं? क्या यह संभव है?

संदर्भ के लिए फाउंडेशन वेबसाइट का एक लिंक यहां दिया गया है: http://foundation.zurb.com/sites/docs/v/5.5.3/components/equalizer.html

उत्तर:

जवाब के लिए 2 № 1

(मैं अपने जवाब के साथ मान रहा हूं कि आप पहले ही जानते हैं कि HAML का उपयोग कैसे करें।)

आप कक्षाओं को सामान्य के रूप में प्रस्तुत करेंगे, लेकिन डेटा विशेषताओं को विशेष रूप से HAML में डालना होगा। सौभाग्य से एचएएमएल दस्तावेज मैंने अभी पाया है कि यह कैसे करें: http://haml.info/docs/yardoc/file.REFERENCE.html#html5_custom_data_attributes

HTML5 Custom Data Attributes

HTML5 allows for adding custom non-visible data attributes to elements using attribute names beginning with data-. Custom data attributes can be used in Haml by using the key :data with a Hash value in an attribute hash. Each of the key/value pairs in the Hash will be transformed into a custom data attribute. For example:

%a{:href=>"/posts", :data => {:author_id => 123}} Posts By Author

will render as:

<a data-author-id="123" href="/posts">Posts By Author</a>

अधिक जानकारी प्राप्त करने के लिए उस पृष्ठ को पढ़ें।