How to do a For Each Item in an array in LESS css - Stack ...
文章推薦指數： 80 %
Loop through array of variable names in Less - Stack Overflow Home Public Questions Tags Users Companies Collectives ExploreCollectives Teams StackOverflowforTeams –Startcollaboratingandsharingorganizationalknowledge. CreateafreeTeam WhyTeams? Teams CreatefreeTeam Collectives™onStackOverflow Findcentralized,trustedcontentandcollaboratearoundthetechnologiesyouusemost. Learnmore Teams Q&Aforwork Connectandshareknowledgewithinasinglelocationthatisstructuredandeasytosearch. Learnmore HowtodoaForEachIteminanarrayinLESScss AskQuestion Asked 1year,11monthsago Modified 1year,10monthsago Viewed 129times 0 IhavingtroublewritingaforeachiteminLESScss Iamnewtousingless,ifsomeonecouldshowmeanexampleIwouldappreciateit Iamusingthefollowing: "less":"^3.11.3", "node-less-chokidar":"^0.4.1", "npm-run-all":"^4.1.5", @values:23,14,45; .as-test(@i:length(@a))when(@i>0){ @value:extract(@a,@i); .h-@{value}px{ height:~"@value"px; } .as-test-(@i-1); } .as-test(@values); desiredoutput: .h-23px{ height:23px!important; } .h-14px{ height:14px!important; } .h-45px{ height:45px!important; } cssless Share Improvethisquestion Follow askedJul8,2020at16:28 SeekingGuidanceSeekingGuidance 522bronzebadges Addacomment | 2Answers 2 Sortedby: Resettodefault Highestscore(default) Datemodified(newestfirst) Datecreated(oldestfirst) 0 Usesomethinglikethis @values:23,14,45; .loop(@list,@i:1)when(@i<=length(@list)){ @current:extract(@list,@i)+0px; .h-@{current}{ height:@current!important; } .loop(@list,@i+1); } .loop(@values); Share Improvethisanswer Follow answeredJul11,2020at19:04 AKTAKT 80466silverbadges1616bronzebadges Addacomment | 0 AnalternativetoAbhishekKumarTiwari's(validandworking)answer: @values:23,14,45; each(@values,{ .h-@{value}px{ height:unit(@value,px)!important; } }); Readmore:each(Less) Share Improvethisanswer Follow answeredJul15,2020at15:41 charlescharles 1,60411goldbadge1212silverbadges1919bronzebadges Addacomment | YourAnswer ThanksforcontributingananswertoStackOverflow!Pleasebesuretoanswerthequestion.Providedetailsandshareyourresearch!Butavoid…Askingforhelp,clarification,orrespondingtootheranswers.Makingstatementsbasedonopinion;backthemupwithreferencesorpersonalexperience.Tolearnmore,seeourtipsonwritinggreatanswers. Draftsaved Draftdiscarded Signuporlogin SignupusingGoogle SignupusingFacebook SignupusingEmailandPassword Submit Postasaguest Name Email Required,butnevershown PostYourAnswer Discard Byclicking“PostYourAnswer”,youagreetoourtermsofservice,privacypolicyandcookiepolicy Nottheansweryou'relookingfor?Browseotherquestionstaggedcsslessoraskyourownquestion. TheOverflowBlog Remoteworkiskillingbigoffices.Citiesmustchangetosurvive Onthequantuminternet,datadoesn’tstream;itteleports FeaturedonMeta AnnouncingthearrivalofValuedAssociate#1214:Dalmarus Improvementstositestatusandincidentcommunication CollectivesUpdate:IntroducingBulletins The[comma]tagisbeingburninated AskWizardTestResultsandNextSteps Related 1569 HowcanIverticallycenteradivelementforallbrowsersusingCSS? 2453 HowdoIgivetextoranimageatransparentbackgroundusingCSS? 1560 HowdoIstylea
延伸文章資訊
- 1LESS CSS - Beginner's Guide - Hongkiat
It ships plain CSS with programming traits such as Variables, Functions or Mixin, ... LESS syntax...
- 2A Simple Introduction to Less CSS. | Design by Pelling
The compiler monitoring the LESS folder will detect each time you save / update the LESS file. It...
- 3less Tutorial => Writing a for-each loop
Learn less - Writing a for-each loop. ... A for-each loop in Less has the same key components as ...
- 4用LESS 寫CSS ( 判斷式、迴圈、Function )
經過前兩篇的洗禮，應該可以直接用LESS 來撰寫整個網站的CSS 了，不過如果要針對大型的專案，在樣式的規劃上可能就要用到更進階的設定，第三篇的LESS 文章將會介紹一些 ...
- 5Less CSS
Less extends CSS with dynamic behavior such as variables, mixins, operations and functions. Less ...
