Html-根据不同的分辨率设置不同的背景图片

2023-11-06

@media only screen and (min-width1024px)     //当分辨率width >= 1024px 时使用1.jpg作为背景图片
{            
.bg{
  background:url(./images/1.jpg) no-repeat;
 }
}
@media only screen and (min-width400pxand (max-width1024px)    //当分辨率400px width 1024px 时使用2.jpg作为背景图片
{  
   .bg{
           background:url(./images/2.jpg) no-repeat;
        }
}
@media only screen and (mmax-width400px)    //当分辨率width =< 400px 时使用3.jpg作为背景图片
{   
     .bg{
             background:url(./images/3.jpg) no-repeat;
          }
}

转载于:https://www.cnblogs.com/huanhuan55/p/9789301.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Html-根据不同的分辨率设置不同的背景图片 的相关文章

随机推荐

  • Stable Diffusion WebUI内存不够爆CUDA Out of memory怎么办?

    在我们运行SD的时候 我们经常会爆CUDA Out of memory 我们应该怎么办呢 这是因为我们的显存或者内存不够了 如果你是用cpu来跑图的则表示内存不够 这个时候就需要换个大点的内存了 如果你是用gpu来跑图的就说明你显存不够用咯
  • 【教程】如何使用Java生成PDF文档?

    在如今数字化时代 越来越多的人使用PDF文档进行信息传递和共享 而使用Java生成PDF文档也成为了一个非常重要的技能 因为Java作为一种通用的编程语言 可以在不同的操作系统和平台上运行 下面 我们将为您介绍如何使用Java生成PDF文档
  • vue中手机号码+座机号码、邮箱正则校验规则封装

    直接上代码 封装验证器 export function isvalidPhone phone const isPhone 1 38 0 9 4 014 9 59 0 35 9 6 2567 7 0 8 d 8 11位合法手机号码 const
  • TI(德州仪器) TMS320C674x逆向分析之二

    TI官网文档 http www ti com product tms320c6745 technicaldocuments 里面资料非常详细 可以对着里面一个个看 用的比较多的两个文档 TMS320C674x指令格式 TMS320C674x
  • 【linux kernel】记一次linux内核裁剪总结

    记一次linux内核裁剪总结 一 背景 在linux内核构建过程中 根据实际应用场景 小生构建了一个大约5 7M大小的linux内核zImage镜像 发现其稍微有点大了 想着将其裁剪和缩小 于是乎对linux内核进行裁剪 本篇文章主要记录一
  • 谷歌浏览器ajax警告,ajax请求的问题,谷歌浏览器的警告提示Provisional headers are shown...

    不太了解百度后台是什么情况 我也只是做一个简单的搜索功能用了跨域 我看数据请求成功了 数据已经返回 但是谷歌浏览器总是出现这种情况 友情提示 愿意回答的大神就请帮着看看 不愿意帮助的也请别乱踩 别干缺德事 还有就是我在hbulider下面打
  • VNC unable to connect via 127.0.0.1:1080

    VNC远程登录出现自己电脑拒绝的时候 请查看一下自己是否设了代理登录之类的操作 这里是WIN 10 登录远程一台WIN 10 服务器 跟服务器设置没有什么关系 主要由于本地配置导致的 解决方案 File里面选择属性 取消代理设置即可 折腾了
  • WebTransport 开播的应用实践之路

    动手点关注 干货不迷路 Web开播的业务挑战 无论是本地软件推流还是Web推流 都需要解决推流抖动 画面高糊 音频卡顿等问题 在现有的Web技术环境下 如何稳定地把高质量的音视频流呈现给更多用户 是我们技术团队攻克的重点 从技术角度来解读一
  • Hashtable和HashMap、ConcurrentHashMap 之间的区别

    Hashtable和HashMap的区别 HashMap和Hashtable都是哈希表数据结构 但是Hashtable是线程安全的 HashMap是线程不安全的 Hashtable实现线程安全就是简单的把关键方法都加上了synchroniz
  • 企业项目实战----CDN加速的实现

    前言 CDN加速对企业非常重要 体现在哪呢 举个例子 A企业的后端服务器在杭州 用户遍布全国 让全国的用户都去访问企业A在杭州的后端服务器你觉得可行吗 肯定不可行呀 第一 后端服务器承受不了全国这么巨大的访问量 第二 访问速度慢 要经过的陆
  • 提升职场价值,把握成长方向

    来自 IT人的职场进阶 同样的职场起点 为什么几年后大家差距很大 如果想快速升职加薪 有什么好方法吗 如何才能做到持续且快速的成长 这些疑惑都离不开一个本质问题 职场价值 因为企业用人的核心出发点是 你能否为企业创造价值 你的价值和薪酬职级
  • MSP430 EEPROM-24C512使用总结及代码说明

    MSP430 EEPROM 24C512使用总结及代码说明 https wenku baidu com view 61f407d6f705cc175527094b html
  • hooks中useMemo和useCallback详解

    要想学习useMemo必须要先知道React memo 这两者都有一定的优化作用 memo的作用 当数据变化时 代码会重新执行一遍 但是子组件数据没有变化也会执行 这个时候可以使用memo将子组件封装起来 让子组件的数据只在发生改变时才会执
  • sudo rosdep init ERROR: cannot download default sources list from:

    在sudo rosdep init时出现的错误ERROR cannot download default sources list from https raw githubusercontent com ros rosdistro mas
  • 安装一个虚拟服务器,一个云服务器可以装虚拟机么

    一个云服务器可以装虚拟机么 内容精选 换一换 虚拟IP地址用于为网卡提供第二个IP地址 同时支持与多个云服务器的网卡绑定 从而实现多个云服务器之间的高可用性 登录管理控制台 单击管理控制台左上角的 选择区域和项目 选择 计算 gt 云耀云服
  • WEB前端命名规范

    https www cnblogs com ysx215 p 7461777 html
  • 数组指针 行指针 列指针

    概念 我们把指向数组的指针叫做数组指针 后面还会学到指针数组 这两个是不一样的 根据中学语文偏正词组的知识可以知道 前者是指针 后者是数组 一般指针变量 int a 2 3 1 2 3 4 5 6 int P a 0 0 int p a 0
  • 短视频账号矩阵系统如何技术嵌入Chatgpt?

    将GPT Generative Pre trained Transformer 嵌入短视频账号矩阵系统需要以下步骤 1 获取GPT模型 可以自行训练或使用开源的预训练模型 如GPT 2 GPT 3等 2 导入GPT模型 将GPT模型导入到短
  • Metronic学习-1-替换google字体,让页面打开更流畅

    Metronic是一款强大的后台模板 包括很多组件 接触过很多后台模板 有Layui AdminLTE Inspinia hui 感觉Layui适合快速开发 Layui封闭性很强 对于前端不太熟悉的话 只能按模仿 如果需要深入学习 需要花费
  • Html-根据不同的分辨率设置不同的背景图片

    media only screen and min width 1024px 当分辨率width gt 1024px 时使用1 jpg作为背景图片 bg background url images 1 jpg no repeat media