CSS 什么是大型桌面的媒体查询?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/42415141/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What is the media query for large desktops?
提问by sireesha j
I am using media query for normal desktop screen and idt should not applicable for larger screens. But below media query applied to large desktop screen also. Please correct my media query, For all help thanks in advance.
我在普通桌面屏幕上使用媒体查询,idt 不适用于更大的屏幕。但是下面的媒体查询也适用于大桌面屏幕。请更正我的媒体查询,提前感谢所有帮助。
@media (min-width: 992px) and (max-width : 1200px){//This should work for Normal desktops(15 to 18 inch) only.
}
回答by Himanshu Dhiraj Mishra
The challenges of optimizing for large-scale displays center around how to scale and manage content.
You need to assume screen width at certain points.
优化大型显示器的挑战集中在如何扩展和管理内容上。您需要在某些点假设屏幕宽度。
Example:for class "container"
示例:对于“容器”类
@media screen and (min-width: 1400px) {
.container {
width: 1370px;
}
}
@media screen and (min-width: 1600px) {
.container {
width: 1570px;
}
}
@media screen and (min-width: 1900px) {
.container {
width: 1870px;
}
}
回答by shihab
You may also try any one of these
您也可以尝试其中任何一种
@media only screen and (min-width : 1224px) {
/* Styles */
}
@media only screen and (min-width : 1824px) {
/* Styles */
}
回答by pradeep prasanna rajapaksha
Just check what are the screen sizes you need to styled with difference styles. then use media queries as you need. ;)
只需检查您需要使用不同样式进行样式设置的屏幕尺寸是多少。然后根据需要使用媒体查询。;)
@media screen and (min-width: 1400px) {}
@media screen and (min-width: 1400px) {}
@media screen and (min-width: 1600px) {}
@media screen and (min-width: 1600px) {}
@media screen and (min-width: 1900px) {}
@media screen and (min-width: 1900px) {}
回答by Inwcode
@media screen and (min-width: 1400px) {
}
@media screen and (min-width: 1600px) {
}
@media screen and (min-width: 1900px) {
}
回答by Manij Rai
if you want to target larger screen in css then you have to define width criteria for large resolution. I mean if you want to target 4k screen
如果你想在 css 中定位更大的屏幕,那么你必须为大分辨率定义宽度标准。我的意思是如果你想瞄准 4k 屏幕
@media (min-width: 2000px) {
}
In media query , screen resolution is considered for screen size.And when you target screen size using css, you must target the screen resolution range.
在媒体查询中,屏幕分辨率会考虑屏幕尺寸。当您使用 css 定位屏幕尺寸时,您必须定位屏幕分辨率范围。