最近接手前端页面,让给调样式。哥纯粹一个代码程序猿,表示那些个样式应该让前端人员或者美工小妹妹来实现.

书归正传,碰到了问题,页面要在手机上展现,众所周知,手机在中国的牌子很多,很难做到统一。

页面上有五个导航栏,是按百分比设置的,让我搞个背景图,点击某一导航栏的时候,背景改变,BUT,给我的背景图是一张有着固定大小的图片,放上去之后,各种不适应,不和谐,后来就想到如果能让背景图自适应导航栏的宽高不就行了么,非经一番波折,无以成真身。

.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%;}

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

原文:https://blog.csdn.net/chenqk_123/article/details/44402355

css背景图片充满DIV的更多相关文章

  1. css - 背景图片充满整个屏幕

    body { /* 加载背景图 */ background: url("../static/images/index/backImg.jpg") no-repeat; /* 背景图 ...

  2. div css背景图片不显示

    我们在写页面时,为了便于维护,css样式通常都是通过link外部导入html的,有时在css中写入背景图片时,此时背景图片的路径应该是相对css文件的.比如,此时的文件有index.html,css. ...

  3. css背景图片拉伸 以及100% 满屏显示

    如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...

  4. CSS背景图片定位

    原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...

  5. css背景图片位置:background的position(转)

    css背景图片位置:background的position   position的两个参数:水平方向的位置,垂直方向的位置----------该位置是指背景图片相对于前景对象的 1.backgroun ...

  6. Bootstrap css背景图片的设置

    一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...

  7. css背景图片位置:background的position

    position的两个参数:水平方向的位置,垂直方向的位置----------该位置是指背景图片相对于前景对象的 1.background:url(../image/header.jpg) no-re ...

  8. CSS实现图片在div a标签中水平垂直居中

    CSS实现图片在div a标签中水平垂直居中 <div class="demo"> <a href="#"> <img src=& ...

  9. 【IE6的疯狂之八】链接伪类(:hover)CSS背景图片有闪动BUG

    IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存. 例如: CSS代码 a:hover{background:url(imagepath ...

随机推荐

  1. HTML&CSS_基础04

    一.常见的选择器 1. 元素选择器 选择页面中指定的元素 2. id选择器 语法:#id属性值{} 3. 类选择器 语法:.class属性值{} 可以为同一个元素设置多个属性值,多个值之间用空格隔开 ...

  2. 树莓派中QT实现I2C

    树莓派中QT实现I2C 在QT中实现 I2C 使用的驱动为 wiringPi 库的引入 LIBS += -lwiringPi LIBS += -lwiringPiDev 代码实现 widget.h 中 ...

  3. FTP文件上传并支持断点续传(一)—— win10 本地环境 ftp站点构建

    由于之前项目开发是采用是采用的FTP文件上传,就一直想学习,但由于FTP服务器是公司的,为了方便就像把本地变成ftp站点,其实很简单,但也有很多坑 这里简单介绍一下自己遇到的坑 一:开通本地的ftp权 ...

  4. JSP、HTML页面概述

    1. 展示 <%-- 此页面为jsp页面 --%> <!-- <%-- 注释 --%> JSP注释,注释内容不会被发送至浏览器甚至不会被编译 --> <%-- ...

  5. python全栈开发中级班全程笔记(第二模块、第四章(三、re 正则表达式))

    python全栈开发笔记第二模块   第四章 :常用模块(第三部分) 一.正则表达式的作用与方法 正则表达式是什么呢?一个问题带来正则表达式的重要性和作用      有一个需求 : 从文件中读取所有联 ...

  6. SQL随记(五)——函数篇

    1.SQL函数: (1)replace(String1,String2,String3):从String1字符串中找到String2,然后用String3替换String2 如:replace('ab ...

  7. 1.9 分布式协调服务-Zookeeper(二)

    zoo.cfg配置文件分析 tickTime=2000  zookeeper中最小的时间单位长度 (ms) initLimit=10  follower节点启动后与leader节点完成数据同步的时间 ...

  8. ActiveMQ 的安装与使用(单节点)

    环境:CentOS6.6.JDK8 1.下载:http://archive.apache.org/dist/activemq/5.11.1/apache-activemq-5.11.1-bin.tar ...

  9. Python——安居客租房信息爬取(以南昌为例)

    前言: 提前安装好所需要的库. 本代码的输入仅需要某个城市的租房地址首页即可,其他自会生成. 使用前请创建所需的目录,或者为代码添加os.makedir() 支持断点重爬,重行运行即可. header ...

  10. python常用的内置函数哈哈

    python常用的内置函数集合做一个归类用的时候可以查找 abs 返回数字x的绝对值或者x的摸 all (iterable)对于可迭代的对象iterable中所有元素x都有bool(x)为true,就 ...