基于PHP变量的CSS媒体查询


CSS Media Queries based on PHP variable

我有一个多语言网站,该网站的所有文本都是基于每种语言的PHP会话变量加载的。我的问题是,当用德语加载文本时,页面顶部的菜单栏对于它的容器来说太长了,一些菜单项会掉到下面。这是可以的,但下拉的菜单项会阻止选择子菜单。

有没有一种方法可以在选择某个变量时使用css媒体查询来减小菜单的字体大小?

最好的方法是根据语言(例如<body class="language-german">)在正文中添加一个CSS类,然后根据该编写CSS规则

body.lang-german nav {font-size: 12px;} 

没有这样的媒体查询,但你可以做什么:

  1. 检查会话中的语言是否为德语
  2. 如果没有,那就别做比现在更多的事情
  3. 如果是,请加载一个额外的CSS文件或额外的规则,其中您已经定义了字体大小,例如:
nav ul li {
  font-size: 10px;
  font-size: 0.8rem;
}

这不会改变其他语言的任何内容,对于德语,您可以定义自定义CSS(font-size,当然也可以定义其他任何内容)

将CSS文件设置为PHP文件。是的,你可以做到,这不是魔术。

假设您有一个名为style.css的CSS文件:将其重命名为style.css.php.css是可选的)

<?php
$lang = $_SESSION['page_lang']; //or however you prefer
if($lang == 'de'){
  echo "german style rules";
} else {
  echo "other style rules";
}

当然,这是简化的,但应该会让你继续。