隐藏和显示取决于屏幕大小bootstrap 3类

Question

对于某些人来说,这似乎很容易,而且根据我所写的内容,我似乎会按照我的意愿行事,但遗憾的是并非如此我有两张图片,每张图片都会根据屏幕尺寸显示,所以对于HTML中的第一个我放置了隐藏-md,hidden-sm,hidden-xs,这会给我留下印象它只会在大屏幕上显示,第二个我只想在平板电脑/手机上看到所以我已经分配了visible-sm,visible-md和hidden-lg但是当我重新调整浏览器大小时,当我最小化到平板电脑大小时,第一个图像不会消失,但是当最小化时它会消失浏览器下降到移动设备大小,谁能发现我做错了什么？

 <a class="navbar-brand hidden-md, hidden-sm, hidden-xs" style=" background-image: url('/Content/Images/FirstImage.png'); background-repeat: no-repeat;" href='@Url.Action("Index", "Home")'></a>

 <a class="navbar-brand hidden-lg, visible-sm, visible-md" style=" background-image: url('/Content/Images/SecondImage.png'); background-repeat: no-repeat;" href='@Url.Action("Index", "Home")'></a>

Answer 1

你班上有逗号.删除这些,它应该按预期工作.

<a class="navbar-brand hidden-md hidden-sm hidden-xs" style=" background-image: url('/Content/Images/FirstImage.png'); background-repeat: no-repeat;" href='@Url.Action("Index", "Home")'></a>

<a class="navbar-brand hidden-lg visible-sm visible-md" style=" background-image: url('/Content/Images/SecondImage.png'); background-repeat: no-repeat;" href='@Url.Action("Index", "Home")'></a>