在不同设备上显示不同的图像

时间:2016-05-01 22:25:10

标签: javascript android ios css

我正在寻找一种在同一位置显示不同图像的方法,具体取决于网站提取的设备。

更多背景:我将我的徽标放在导航栏中 - 它完全适合桌面版本以将其显示在一行中 - 在移动版本上它太长并且扩展到两行。我想在桌面网站上使用我的完整徽标,并在移动网站上仅使用我徽标中的小符号。

感谢。

2 个答案:

答案 0 :(得分:1)

如果您正在使用Bootstrap,则可以通过向图像添加类来轻松完成。 (http://getbootstrap.com/css/#responsive-utilities

答案 1 :(得分:0)

您可以使用可见和隐藏类轻松地完成此操作

使用以下任何类来隐藏特定显示器上的某个标签/元素并显示其余部分。

  1. 隐藏-XS
  2. 隐藏-SM
  3. 隐藏-MD
  4. 隐藏-LG
  5. 使用以下任何类,以便在特定显示器上显示某个标记/元素并隐藏在其余部分上。

    1. 可见-XS
    2. 可见-SM
    3. 可见-MD
    4. 可见-LG
    5. 还需要更多解释吗?打我回来:))