Mehrsprachigkeit, Beurteilung
bearbeitet von Gunnar Bittersmann@@beatovich
> Sprachversionen müssen unmittelbare Kinder des Elements mit lang="multi" sein.
Welches es nicht geben sollte. `multi` ist kein gültiger Wert fürs [`lang`-Attribut](https://w3c.github.io/html/dom.html#element-attrdef-global-lang); das dürfen nur Sprachkürzel sein. Verwende bspw. `class="multilingual"`.
> Das funktioniert, sollte aber rationeller notiert werden.
Du willst also dasjenige Kind eines `.multilingual{:.language-css}`-Containers (um beim obigen Vorschlag zu bleiben) anzeigen, dessen Sprache mit der in `_.lang` vorgegebenen überseinstimmt, und wenn es kein solches gibt, dann das letzte?
Also alle anderen ausblenden (hier in Sass-Syntax mit der vorgegebenen Sprache in `$lang`):
~~~SCSS
$lang: 'en';
.multilang > :not([lang|="#{$lang}"]):not(:last-child),
.multilang > [lang|="#{$lang}"] ~ :last-child
{
display: none;
}
~~~
Es werden alle Kindelemente von `.multilingual`{:.language-css} ausgeblendet, deren Sprache nicht mit `$lang` übereinstimmt, außer dem letzten, was als Defaultsprache erhalten bleibt. Wenn es ein Kindelement von `.multilingual`{:.language-css} gibt, dessen Sprache mit `$lang` übereinstimmt und dieses nicht das letzte ist, dann wird auch das letzte ausgeblendet.
☞ [Codepen](https://codepen.io/gunnarbittersmann/pen/vQjaXM) zum Rumspielen
Zum Vergleichen habe ich `|=` verwendet. Womöglich ist aber nicht `[lang|="…"]`{:.language-css}, sondern `:lang(…)`{:.language-css} die bessere Wahl. ☞ [Stylen anhand von Sprachattributen](https://www.w3.org/International/questions/qa-css-lang.de)
Was es mit dem `html[data-lang]`{:.language-css} bei dir auf sich hat, habe ich nicht so ganz verstanden.
LLAP 🖖
--
*„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann