我使用媒体查询,我希望网页上的内容能够响应。
这段代码可以吗?
@media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3){
.navmob{margin-top:0px; margin-left:-100px; margin-right:100px !important; }
.sidebar { display: none; }
#navmenu {margin-top:10px; margin-left:auto; margin-right:100px; }
.content {width:auto; height:auto; margin-left:100px; margin-top:-50px;}
.contentsing{ width:500px; height:auto; margin-left:auto; margin-right:auto; margin-top:-50px !important;}
body{
background-image:none !important;
background-color:#000000 !important;
font-size:12px !important;
}
}
以及为什么内容没有响应......这是example
这是我的代码 index
最佳答案
我在控制台中发现了很多错误。无论如何我都无法解决所有这些问题,但我可以告诉你,当你制作响应式模板时,你需要处理宽度。这些是我尝试管理您的模板的一些 css 行,希望对您有所帮助 按原样放置它们
@media(max-width:714px){
.posts .post-item{width:96%}
.text5{width:100%}
#navmenu ul{width:90%}
}
关于html - 响应式网页内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20757848/