mogę napisać pętlę dla CSS

Mam scenariusz, gdzie jestem coraz identyfikator generowany jak tenmogę napisać pętlę dla CSS

<div class="containerLength"> 
<div id="new-1"></div> 
<div id="new-2"></div> 
<div id="new-3"></div> 
<div id="new-4"></div> 
</div>

i tak dalej

czy istnieje sposób mogę napisać css kierować ich przez pętla? może coś takiego, jak

#new[i; for(i=0; i<="containerLength.length"; i++)]{ 
float:left; 
}

Prawdopodobnie dzień mi się śni, prawda?

Źródło

2013-06-07 soum

Z gładką wanilią Nr CSS Dlaczego zamiast tego przypisać klasę do tych elementów? Możesz jednak wypróbować 'div.containerLength> div {...}' – j08691

Może duplikat http://stackoverflow.com/questions/4914533/do-css-functions-exist? –

'div.containerLength div [id^=" new "] {float: left; } '? Co próbujesz zrobić z tymi elementami, po znalezieniu "zapętlonego"? –

Nie można zrobić pętle z czystym CSS, jednak jeśli używasz coś podobnego SASS lub mniej, może to zrobić zarówno jak:

SASS:

@for $i from 1 through 4 
    .#{$class-slug}-#{$i} 
    width: 60px + $i

MNIEJ:

Can you do a javascript for loop inside of LESS css?

jednak zakładając, że po prostu chcesz zastosować ten sam styl do każdego zagnieżdżonego div, można po prostu zrobić

.containerLength > div{ 
    float: left; 
}

lub może utworzyć klasę o nazwie .float-left i zastosować go do każdego elementu, który chcesz swobodny prawo.

Źródło

2013-06-07 15:29:13 Prisoner

Dlaczego nie spróbować tego:

.containerLength > div {float:left}

Źródło

2013-06-07 15:27:33

Można zrobić

div.containerLength > div { /* > Matches only first level children of the wrapper div */ 
    float: left; 
}

Źródło

2013-06-07 15:27:42 karthikr

Naprawdę nie potrzebujesz początkowego "div", wystarczy ".containerLength> div". –

@facildelembrar Zazwyczaj lubię trzymać rzeczy bardziej wyraźne. Zgadzam się, że nie jest to wymagane. – karthikr

W przypadku CSS lepiej jest być zbyt szczegółowym, niż niewystarczająco dokładnym. Wybierz tylko to, co chcesz zmienić, i nic więcej. Nie mogę powiedzieć, ile godzin pracy spędziłem na naprawianiu złych selektorów CSS. –

div[id|="new"]{ 
    float: left; 
}

documentation

mogą lub nie mogą potrzebować cytaty, to dziwne, czasem trzeba.

Źródło

2013-06-07 15:28:50

nie można napisać żadnej logiki w css. możesz jednak zarządzać css za pomocą JavaScript lub dołączyć wiele identyfikatorów w jednej regule lub po prostu użyć klasy.

Możesz także być w stanie korzystać z selektorów atrybutów Css, w zależności od tego, jak identyfikatory są uporządkowane i jak szerokie potrzebujesz obsługi przeglądarki.

https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors

Źródło

2013-06-07 15:31:31 DougM

Dzięki chłopaki. To było naprawdę świetne. Dziękuje za twoją pomoc – soum

mogę napisać pętlę dla CSS

Odpowiedz

Powiązane problemy