首页 > 其他分享 >CSS中自适应屏幕分辨率

CSS中自适应屏幕分辨率

时间:2023-05-25 20:07:29浏览次数:33  
标签:media screen 打印 中自 width css max 分辨率 CSS


@media与@media screen区别

@media screen的css在打印设备里是无效的,而@media在打印设备里是有效的,如果css需要用在打印设备里,那么就用@media ,否则,就用@media screen。

@media (max-width: 1199){ //<=1199的设备 }
@media (max-width: 991px){ //<=991的设备 }
@media (max-width: 767px){ //<=768的设备 }

【注意】用min-width时,小的放上面大的在下面,同理如果是用max-width那么就是大的在上面,小的在下面

标签:media,screen,打印,中自,width,css,max,分辨率,CSS
From: https://blog.51cto.com/chengzheng183/6350770

相关文章

  • CSS设置元素水平居中、垂直居中方式汇总
    按照水平居中、垂直居中、行内元素、块级元素等条件进行组合获取效果水平居中:行内元素解决方案只需要把行内元素包裹在一个属性display为block的父层元素中,并且把父层元素添加如下属性即可:.parent{text-align:center;}水平居中:块状元素解决方案.item{/*这里可以设置......
  • 用css给坤坤增打篮球加一些灵动效果(ikun忠实粉丝
    首先我们拿出珍藏已久的ikun背景图,没有的下载下来,也可以到网上找一个类似的新建ikun.html,把下载下来的ikun.gif和ikun.html放在同一个文件夹下在ikun.html的div里写满ikun,然后加上一些神奇的css。在线预览ikun.html全部代码<!DOCTYPEhtml><htmllang="zh_CN"><head><......
  • .vue文件中引入单独的css文件
    问题描述单页面应用中一般把样式文件写在.vue文件中,如下:<stylescoped>#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#2c3e50;margin-top:60px;font-size:1......
  • 现代 CSS 解决方案:CSS 原生支持的三角函数
    在CSS中,存在许多数学函数,这些函数能够通过简单的计算操作来生成某些属性值,例如:calc():用于计算任意长度、百分比或数值型数据,并将其作为CSS属性值。min()和max():用于比较一组数值中的最大值或最小值,也可以与任意长度、百分比或数值型数据一同使用。clamp():用于将属性值......
  • KSV5-系统错误或用户设置: 在集中为表CCSS的读取错误
    系统错误或用户设置:在集中为表CCSS的读取错误消息号GA622诊断设置应用于分配配置(表T811X)。不存在设置。系统响应因为发生严重系统错误或者分配配置错误,处理被终止。步骤配置错误通常是由于版本修改或者集团复制不完全。使用程序RK811XST,可以排除这些错误。运行该......
  • CSS:页面美化和布局控制和选择器
    CSS:页面美化和布局控制和选择器概念:CascadingStyleSheets层叠样式表层叠:多个样式可以作用在同一个html的元素上,同时生效好处:功能强大将内容展示和样式控制分离降低耦合度。解耦让分工协作更容易提高开发效率CSS的使用:CSS与html结合方式内联样式在标签内使用style属......
  • css优先级
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatib......
  • HTML与CSS综合设计报告
    【项目描述】最近来自国产的独立像素游戏《风来之国》发售,借此做一个相关的游戏介绍网页来介绍这款游戏,并收集感兴趣玩家的信息反馈,以此改进游戏,吸引玩家的加入。  图1主页预览图【涉及知识点】1、 HTML布局2、 文本属性3、 图片的插入4、 css链入式的使用......
  • 【CSS】div宽度由内部文字宽度决定
    默认div的宽度会占满全屏或由父级决定使用  width:fit-content;可以解决前后对比前:后: ......
  • vue中使用scss公共变量的方法 :export
    vue中使用scss公共变量的方法:export:https://blog.csdn.net/weixin_44698285/article/details/124051066?spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-124051066-blog-125074100.235%5Ev36%5Epc_relevant_def......