css中 media的用法,如何在css中正确使用@media

如何在css中使用@media作为特定分辨率？所以我想让我的侧栏更改取决于用户分辨率，所以我使用@media。如何在css中正确使用@media

这是示例代码：

@media (max-width: 1920px) and (min-width: 1080px){ /*for 1920 x 1080*/

.logo1{

margin-top: 70%;

}

.socmed a:nth-child(1), .socmed a:nth-child(2){

margin-top: 100%;

}

@media (max-width: 1680px) and (min-width: 1050px){ /*for 1680 x 1050*/

.logo1{

margin-top: 70%;

}

.socmed a:nth-child(1), .socmed a:nth-child(2){

margin-top: 90%;

}

@media (max-width: 1600px) and (min-width: 900px){ /*for 1600 x 900*/

.logo1{

margin-top: 50%;

}

.socmed a:nth-child(1), .socmed a:nth-child(2){

margin-top: 40%;

}

@media (max-width: 1440px) and (min-width: 900px){ /*for 1440 x 900*/

.logo1{

margin-top: 40%;

}

.socmed a:nth-child(1), .socmed a:nth-child(2){

margin-top: 50%;

}

@media (max-width: 1400px) and (min-width: 1050px){ /*for 1400 x 1050*/

.logo1{

margin-top: 70%;

}

.socmed a:nth-child(1), .socmed a:nth-child(2){

margin-top: 90%;

}

@media (max-width: 1366px) and (min-width:768px){ /*for 1366 x 768 until 1024 x 768*/

.socmed a:nth-child(1), .socmed a:nth-child(2){

margin-top: 20%;

}

这些代码，我把用途分辨率的评论，它工作得很好，直到我从1366×768打开我的网站和波纹管，它是覆盖与@media (max-width: 1400px) and (min-width: 1050px)。我如何防止这个问题呢？谢谢

2017-03-16

Rian

您错误地使用了宽度和高度。 –

噢，我的上帝，所以我应该使用最小宽度和最小高度？ @Roberrrt –

css中 media的用法,如何在css中正确使用@media相关推荐

linux中test的用法,如何在Linux中使用test命令
Linux系统中有时需要检测某个条件是否成立,那么就要用到test命令了,Linux下test的用法有很多,下面就随学习啦小编一起来学习下Linux系统中如何使用test命令吧. 1.判断一个命令的结 ...
怎么样在html中直接使用图片,如何在css中引用图片
如何在css中引用图片 css中引入图片一般有3种形式,1.从本地引用图片:2.从网络引用图片:3.使用base64对图片编码进行引用. 一.从本地引用图片引用本地图片时,会用相对的地址,而不是绝对 ...
在html中css的图片路径,html - 如何在css使用绝对路径的图片做背景
html - 如何在css使用绝对路径的图片做背景怪我咯2017-06-17 09:15:48 0 2 389 在做一个项目,里面有很多图片要展示,处于后期维护方便的考虑,准备做成把图片上传 ...
html中section与div,如何在html中的section标签内包含div标签
我正在制作一个完整版块的页面网站,如this.每个页面都有自己的标签.目前我的网页有4个部分(呈现不同的背景颜色).如何在html中的section标签内包含div标签我的第一部分有一个容器div, ...
excel中去重计数_如何在Excel中计数
excel中去重计数 There are lots of different ways to count things in Excel – maybe you need to count the n ...
python中range 10 0_如何在python中使用range方法
如何在python中使用range方法发布时间:2021-01-05 16:55:23 来源:亿速云阅读:94 作者:Leah 如何在python中使用range方法?很多新手对此不是很清楚,为了 ...
python中result的用法_关于Python中的列表理解及用法
在Python中,列表理解通常用于编写单行语句,这些语句通过可迭代对象进行迭代以创建新的列表或字典.本文首先介绍for循环如何在Python中工作,然后解释如何在Python中使用列表理解. Pyth ...
python中print的用法_Python2与Python3中print用法总结
Python2中的print用法在Python2 中 print 是一种输出语句 strHello = 'Hello Python' print strHello # Hello Python 1. ...
[转载]C#中MessageBox.Show用法以及VB.NET中MsgBox用法
一.C#中MessageBox.Show用法 MessageBox.Show (String) 显示具有指定文本的消息框. 由 .NET Compact Framework 支持. MessageBo ...

css中 media的用法,如何在css中正确使用@media

css中 media的用法,如何在css中正确使用@media相关推荐

最新文章

热门文章