1. Dom
  2. Pytanie i odpowiedź
  3. ciąg konkatenacja w css

ciąg konkatenacja w css

2013-04-01 14 views
13

Chcę osiągnąć następujące w css. Jak to zrobić w sposób, który działa w IE8 +ciąg konkatenacja w css

url('../img/icons/' + attr('type') + '_10.png')

Źródło

2013-04-01 aWebDeveloper

+0

nie można; Przepraszam. – zzzzBov

+0

@zzzzBov jak to zrobić [class^= "connection -"] :: after – aWebDeveloper

+0

Czy możesz to wyrazić w formie pytania? Nie jestem pewien, o co mnie tutaj pytasz. – zzzzBov

Odpowiedz

1

Nie można zrobić dynamiczny ciąg interpolacji w ten sposób, że sugerujesz, ale jeśli mają ograniczoną liczbę możliwych wartości atrybutu [type], można tworzyć style dla każdego z nich:

.your .selector[type="foo"] { 
    background-image: url('../img/icons/foo_10.png'); 
} 
.your .selector[type="bar"] { 
    background-image: url('../img/icons/bar_10.png'); 
} 
.your .selector[type="baz"] { 
    background-image: url('../img/icons/baz_10.png'); 
}

Jeśli masz nieuzasadnioną liczbę typów, prawdopodobnie będziesz musiał wymyślić lepsze rozwiązanie niż tutaj wymienione.

Źródło

2013-04-01 14:47:46 zzzzBov

14

Nie sądzę, że możesz. We właściwości content można "łączyć" po prostu oddzielając ją spacją, ale w innych miejscach nie sądzę, aby istniała taka funkcja. Co za wstyd.

Najprawdopodobniej najlepiej będzie określić ten styl w atrybucie style, gdy używany jest atrybut type.

Źródło

2013-04-01 14:41:37

+2

Sądzę, że jest to zgodne ze specyfikacją, nie jest jeszcze obsługiwane w żadnej przeglądarce. https://developer.mozilla.org/en/docs/CSS/attr#Browser_Compatibility –

+0

@ Fabrício Matté: Niestety jest to problem związany z url(), a nie z attr(), niezależnie od obsługi przeglądarki, i może nigdy nie być możliwe chyba że ponownie podadzą URL(). Zobacz moją odpowiedź tutaj: http://stackoverflow.com/questions/42932294/css-attr-concatenation-with-url-path/42932766#42932766 – BoltClock

5

Nie, nie można tego zrobić w zwykłym CSS ponieważ język CSS nie ma kontrolę struktur lub coś podobnego wich pozwoli Ci dinamically wygenerować kod CSS.

Zamiast tego można użyć rozwiązania javascript lub rozwiązania opartego na zmiennych CSS zakodowanych w PHP.

Źródło

2013-04-01 14:43:15 Goran

-2

prostu użyć tego:

url('../img/icons/' attr('type') '_10.png')

Źródło

2017-05-13 00:28:56

+0

** Z kolejki do przeglądania **: Czy mogę prosić o dodanie? kontekst wokół twojej odpowiedzi. Odpowiedzi dotyczące tylko kodu są trudne do zrozumienia. Pomoże to pytającemu i przyszłym czytelnikom, jeśli dodasz więcej informacji do swojego postu. – RBT

Powiązane problemy

 Powiązane problemy