javascript - 网页部分仅对手机可见

标签 javascript css html

<分区>

我为我制作的某个 Web 应用程序构建了一个网页。 我只想为智能手机用户添加一个特定选项,并且不希望它对非智能手机用户可见。 有没有什么方法可以定义一个部分 ( div ) 只对智能手机用户可见?

提前致谢。

最佳答案

您可以使用响应式设计方法,并使用媒体查询仅通过 css 实现您想要的:

//THIS CSS CLASS IS APPLIED ALWAYS
div.my-option {
    display: none;
}

//THIS MEDIA QUERY APPLIES ITS STYLES ONLY WHEN THE SCREEN WIDTH IS <= 767, SO IT'S A SMARTPHONE DISPLAY.
//IT OVERRIDES THE ONE ABOVE
@media only screen and ( max-width: 767px ) {
    div.my-option {
        display: inline;
    }
}

如果您对响应式设计感兴趣,两个最扩展的选项是 BootstrapZurb Foundation

关于javascript - 网页部分仅对手机可见,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15791109/

上一篇:css - 使用粘性页脚,无法将主要内容的背景拉伸(stretch)到页脚

下一篇:html - CSS Div 填充问题 Internet Explorer

相关文章:

javascript - 如何将 SVG 图像对齐到另一个 SVGpath 的两侧?

css - 文本框对齐问题

javascript - new F 和 new F() 有什么不同吗?

javascript - 在 JSFiddle 中链接外部 JSON 数据文件

javascript - 计算 anchor 中的字符数并调整其大小

javascript - 列出 Select 的选项在 FF 和 IE 中给出不同的结果

css - Bootstrap data-toggle 打开以上问题

javascript - HTML5 canvas 绘制多个在 Canvas 中移动的矩形

css - 移动页面未显示 - Joomla

html - WP即footer不在底部