Html 媒体查询不工作-一个简单的演示页面
在一个简单的html页面中，我无法运行媒体查询。我在一段时间后才开始做这些，因此我认为我犯了一些愚蠢的错误，我无法理解 jsFiddle- HTML 这只是我的页面中的一些示例代码，似乎不起作用。我试着在这里和互联网上寻找类似的问题，但看起来我已经有了这些问题，比如，我的页面有如下正确的元标记，并且正在使用HTML5 doctypeHtml 媒体查询不工作-一个简单的演示页面,html,responsive-design,media-queries,liquid-layout,Html,Responsive Design,Media Queries,Liquid Layout,在一个简单的html页面中，我无法运行媒体查询。我在一段时间后才开始做这些，因此我认为我犯了一些愚蠢的错误，我无法理解 jsFiddle- HTML 这只是我的页面中的一些示例代码，似乎不起作用。我试着在这里和互联网上寻找类似的问题，但看起来我已经有了这些问题，比如，我的页面有如下正确的元标记，并且正在使用HTML5 doctype <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!DOCTYPE html>
媒体的质疑没有起作用。任何帮助都将不胜感激。您不需要在上课前使用标签“div”，并且可能您正在调整浏览器的大小以进行测试，这将不起作用。如果您想获得更动态的效果，您应该使用最小宽度和最大宽度，而不是最小设备宽度和最大设备宽度，请注意“设备”word它不工作，因为“设备”获得屏幕的最小宽度，而不是浏览器的最小宽度
.resume {width:50%;}
.content {padding:10px 10px 25px;}
.content p {text-align:justify; line-height:1.2em; font-size:.9em;}
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) {.resume{width:100%} }
/* iPads (landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) { .resume{width:100%} }
/* iPads (portrait) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) { .resume{width:100%} }
对，这是正确的，它只是错误地出现在这里，否则它在我的大量代码中还有其他用途。无论如何，它似乎并没有解决这个问题。也许你是为了测试而调整浏览器的大小，这是行不通的，如果你想有一个更动态的效果，你应该使用最小宽度和最大宽度，而不是最小设备宽度和最大设备宽度，请注意“设备”这个词它不起作用，因为“设备”获取屏幕的最小宽度，而不是浏览器的最小宽度！！它在移除设备后工作得很好，我明白为什么会这样，可能是为了我的本地测试，我需要去掉设备。非常感谢，伙计，酷！请将@whyAto8标记为“答案有用”，我很高兴发现答案对您有用，您好
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!DOCTYPE html>
.resume {width:50%;}
.content {padding:10px 10px 25px;}
.content p {text-align:justify; line-height:1.2em; font-size:.9em;}
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) {.resume{width:100%} }
/* iPads (landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) { .resume{width:100%} }
/* iPads (portrait) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) { .resume{width:100%} }