한 요소에 대해 화면 너비에 따라 두 개의 다른 텍스트가 있습니다. 화면 너비가 400px 이하일 때 narrow。当屏幕宽度大于400px时，我想显示large를 표시하고 싶습니다.
코드는 다음과 같습니다: https://jsbin.com/qagetoseva/edit?html,css,output
하지만 문제는 너비가 400px일 때 이 코드는 아무것도 표시하지 않는다는 것입니다. 수정하는 방법을 아는 사람이 있습니까?
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<style>
.me {
height: 100vh;
}
</style>
</head>
<body>
<div class="hide-if-large">narrow</div>
<div class="hide-if-narrow">large</div>
</body>
</html> 
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
친애하는 친구여, CSS 미디어 쿼리에 문제가 있습니다.
으아아아}
으아아아두 번째 미디어 쿼리를 태블릿 크기에 맞게 1024px로 변경했습니다. 최소 너비 1025px
과 같은 대형 화면에 대한 새 미디어 쿼리를 만들어야 합니다.