就是这么简单的一句话,设置背景图,并让它100%的适应导航栏宽高,并设置不重复,大小100%就OK了

.zjhn-nav li.active a{ background-image:url(../image/Click_03_temp.png); background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}

转载来源:https://blog.csdn.net/chenqk_123/article/details/44402355

css background-image 自适应宽高——转载的更多相关文章

  1. css+background实现 图片宽高自适应,拉伸裁剪不变形

    图片宽高不固定 ,一样实现自适应,拉伸裁剪不变形,适应各大兼容性.  下面咱们在网上找两张宽高不一样的照片:     No.1                                      ...

  2. 纯CSS写正方形自适应宽高,且左侧高与正方形高保持一致

    先上图 虽然写法有点暴力,但是效果还是可以的,哈哈哈哈哈html:<div class="box">            <div class="le ...

  3. 小程 序swiper自适应宽高

    https://blog.csdn.net/qq_31604363/article/details/73715944 小程 序swiper自适应宽高 小程 序swiper自适应宽高

  4. OpenGL ES学习笔记(二)——平滑着色、自适应宽高及三维图像生成

    首先申明下,本文为笔者学习<OpenGL ES应用开发实践指南(Android卷)>的笔记,涉及的代码均出自原书,如有需要,请到原书指定源码地址下载. <Android学习笔记--O ...

  5. canvas基础入门(一)canvas的width、height于css样式中的宽高区别

    canvas的width.height于css样式中的宽高对画布的内容显示是有所区别的 1.在canvas标签下调用他的width和height,而且是没有单位的宽高,这种指定canvas大小的方法也 ...

  6. iOS - web自适应宽高(预设置的大小)

    //web自适应宽高 -(void)webViewDidFinishLoad:(UIWebView *)webView { NSLog(@"wessd"); [ webView s ...

  7. UILabel实现自适应宽高需要注意的地方(三)

        一.需求图如下所示    UILabel 的高度自适应 UILabel中的段落间距可设置   图片效果如下:   调整段落适应长宽高方式:         需求:   保证"游戏玩法 ...

  8. iview Carousel 轮播图自适应宽高;iview 轮播图 图片重叠问题;iview tabs 高度互相影响问题;vue this问题;

    最终效果图: 一.轮播图中图片自适应宽高:  <Carousel loop v-bind:height="imgHeight+'px'" v-model="caro ...

  9. CSS Transform让百分比宽高布局元素水平垂直居中

    很早以前了解过当元素是固定宽度和高度的时候,水平垂直高居中的方法可以设置margin的负值来使其居中,这个负值是元素的宽和高的一半,比如宽高是100px,那么就用margin-left:-50px;m ...

随机推荐

  1. 获取【请求体】数据的3种方式(精)(文末代码) request.getInputStream() request.getInputStream() request.getReader()

    application/x- www-form-urlencoded是Post请求默认的请求体内容类型,也是form表单默认的类型.Servlet API规范中对该类型的请求内容提供了request. ...

  2. SignalR 行实时通信最大连接数

    SignalR 搭建实时刷新应用虽然非常方便,但是有个问题你必须考虑到,就是一般的浏览器,对于SignalR的全双工通信方式,绝大多数浏览器都只支持6个新窗口,如果你打开第7个,那么新的框口页面是不会 ...

  3. haproxy反向代理

    haproxy是个高性能的tcp和http的反向代理.它就是个代理.不像nginx还做web服务器 官网地址为www.haproxy.org nginx的优点和缺点 优点: 1.web服务器,应用比较 ...

  4. centos7安装配置tomcat9

    什么是Tomcat Tomcat是由Apache软件基金会下属的Jakarta项目开发的一个Servlet容器,按照Sun Microsystems提供的技术规范,实现了对Servlet和JavaSe ...

  5. theano安装问题

    WARNING (theano.configdefaults): g++ not available, if using conda: `conda install m2w64-toolchain` ...

  6. java Servlet生成随机验证码

    import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Graphics2D; i ...

  7. SQL脚本--总耗CPU最多的前个SQL --平均耗CPU最多的前个SQL

    --总耗CPU最多的前个SQL SELECT TOP 20 total_worker_time/1000 AS [总消耗CPU 时间(ms)],execution_count [运行次数], qs.t ...

  8. 理解OpenShift(7):基于 Prometheus 的集群监控

    理解OpenShift(1):网络之 Router 和 Route 理解OpenShift(2):网络之 DNS(域名服务) 理解OpenShift(3):网络之 SDN 理解OpenShift(4) ...

  9. vue 用正则保护路由参数的合法性

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. C#开发微信支付之企业向用户付款

    1.企业付款的介绍 所谓企业付款指的是,在功能开放后诸如保险行业的客户理赔.退保.商品退款.发放征集活动奖金.抽奖互动等操作都可以通过企业付款完成.而此前,微信支付只能提供客户向企业单向付款. 商户如 ...