Javascript 如果屏幕大小为手机大小，则使用jquery更改字体大小_Javascript_Jquery_Css

Javascript 如果屏幕大小为手机大小，则使用jquery更改字体大小

javascript jquery css

Javascript 如果屏幕大小为手机大小，则使用jquery更改字体大小,javascript,jquery,css,Javascript,Jquery,Css,在我的网页中，如果屏幕大小是手机大小，我想用jquery更改字体大小。我的代码如下： <head> <script type='text/javascript'> if(screen.width <= 600){ $("#para_head").css({"font-size":"12px"}); $("#para_detail").css({"font-size":"10px"}); } </script> <

在我的网页中，如果屏幕大小是手机大小，我想用jquery更改字体大小。我的代码如下：

<head>
<script type='text/javascript'>
 if(screen.width <= 600){

        $("#para_head").css({"font-size":"12px"});
        $("#para_detail").css({"font-size":"10px"});
}
</script>
<style>
#para_head{
}
#para_detail{
}
</style>
</head>
<body>
<div id="para_head">
    Header
</div>
<div id="para_detail">
    Detail
</div>
</body>


如果（screen.width，我建议使用CSS
媒体查询，而不是jQuery。如果应用程序很大，则需要大量jQuery操作，维护起来也会比较困难，最重要的是，它会对DOM造成很大的负担
如下图所示，使用CSS更容易实现响应性网站
@media screen and (max-width: 600px) {
    #para_head {
       font-size: 12px;
    }
}

演示（调整输出窗格的大小）

作为补充说明，对于HTML元素，我将使用烤肉串样式的外壳，para-head
而不是para-head
，更好，但如果您更喜欢jquery解决方案，请参见下文
if ( $(window).width() > 600) {     
  //Add your javascript for large screens here
}
else {

   $("#para_head").css({"font-size":"12px"});
   $("#para_detail").css({"font-size":"10px"});
}

为什么不使用CSS

@仅媒体屏幕和（最大宽度：600px）{
#帕劳头{
字体大小：12px；
}
#段落细节{
字体大小：10px；
}
}

副团长
段落细节
Noted，thz很多。Noted bro.thz请注意，我给你的建议是，我给你的票数比你高，这样你就可以给所有4个好答案投票。你一天可以投30票，但每个问题只能接受一个答案（将鼠标悬停在左边的答案旁边，会出现一个勾号。单击它，它将变为绿色。回答者得到15分，接受你得到2分。双赢！现在跳到它！；）-Rach屏幕未定义。如果你使用控制台，你会看到这一点。最后，媒体查询是正确的选择。