###起因

>今天遇到一个问题,就是在给一个元素设置width 属性为100% 之后, 鼠标放上去之后,仍然只有部分是阴影状态,如下图所示:




---
经过一番思索,这TM 不就是,hover 上去的时候,背景没有盖全嘛,赶紧找相关代码 , 发现了如下代码:
```
.midLeft ul li:hover{
    background-image: url("../img/textBg.png"); 
    background-repeat: no-repeat;
}
```
谁TM 这么蠢,使用了 no-repeat , 就是这句话导致我的100% 宽度不起作用。 改成 repeat-x  就能在横轴方向上扩充了。 下面把这个 参数的详细用法记录一下,以备后用:
| value     |  describe|
|-----------|-------------|
|repeat  | 默认。背景图像将在垂直方向和水平方向重复。|
|repeat-x |背景图像将在水平方向重复。|
|repeat-y |背景图像将在垂直方向重复。|
|no-repeat |背景图像将仅显示一次。|
|inherit |规定应该从父元素继承 background-repeat 属性的设置。|

那么,我们解决自己的问题,直接使用  repeat-x 就 OK 啦~















CSS background-repeat 属性的更多相关文章

  1. css中background背景属性概

    css中background背景属性概 background:url(背景图片路径)  no-repeat;/*不重复默认在左上方*/background:url(背景图片路径)  no-repeat ...

  2. CSS background 属性全家桶

    介绍我们都知道css的background属性是一个复合属性,可以简写成一行代码,也可以将每个属性分开来写. background 简写属性在一个声明中设置所有的背景属性.如:body{ backgr ...

  3. CSS background 属性

    CSS 参考手册 实例 如何在一个声明中设置所有背景属性: body { background: #00FF00 url(bgimage.gif) no-repeat fixed top; } 亲自试 ...

  4. CSS background 属性 总结

    CSS background 属性总结

  5. 前端CSS-font属性,超链接的美化,css精灵,background综合属性

    前端CSS-font属性,超链接的美化,css精灵,background综合属性 1. font属性 使用font属性,能够将字号.行高.字体,能够一起设置. font:14px/24px " ...

  6. CSS background 属性详解

    CSS background Property 语法: background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-cl ...

  7. CSS探案之 background背景属性剖析

    首先,我们先来看看两个css属性:background和background-color,对!就是这两位,相信大家在平时应该没少 麻烦人家把,反正我是这样,几乎也少会用到背景图,原因很简单:就是有点害 ...

  8. CSS样式常用属性整理

    web工程师是最近5年刚刚兴起的一门高薪职业,人们的专注度越来越高. 那么前端除了学习html标签之外还需要掌握什么知识点呢? 为大家整理了一个和HTML标签密不可分的知识要点--<CSS样式常 ...

  9. background复合属性详解(上):background-image

    background复合属性是个很复杂的属性,花样非常多,比较神奇的是css3 中支持多图片背景了,这篇文章先讲讲background-image属性,其他背景属性会在后续的文章综合总结. 一.最基本 ...

  10. HTML CSS——background的认识(一)

    今天回归bug时无意间看到了样式表中background属性,如今总结一下: 1.background-color:设置元素的背景色.其值能够为:color-name.color-rgb.color- ...

随机推荐

  1. 网站图片列表动态显示、根据屏幕宽度动态设置DIV的CSS样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. SQL SERVER2012 无法连接远程服务器

    SQL SERVER2012 无法连接远程服务器,报"尝试读取受保护的内存"错误. 解决方法: 运行CMD,输入 netsh winsock reset,回车.重启SSMS,搞定.

  3. Nicholas C. Zakas如何面试前端工程师

    转载自:http://www.cnblogs.com/yizuierguo/archive/2010/02/04/1663767.html Original Post:Interviewing the ...

  4. Qt 之 show,hide,setVisible,setHidden,close 等小结

    0QObject::deleteLater()delete obj;析构对象1QWidget::setVisible(bool)使得Widget可见或不可见2QWidget::setHidden(bo ...

  5. 开发环境配置--Ubuntu+Qt4+OpenCV(二)

    同系列文章 1. 开发环境配置--Ubuntu+Qt4+OpenCV(一) 2. 开发环境配置--Ubuntu+Qt4+OpenCV(二) 3. 开发环境配置--Ubuntu+Qt4+OpenCV(三 ...

  6. 【JQ成长笔记】jQuery cookie的使用

    jquery cookie挺好用的.简单实在.菜鸟都能用得上..额.文笔不好不好..咳咳.. 先来看看jq.cookie的aip 写入cookie $.cookie("this-cookie ...

  7. ■[iOS] Interface type cannot be statically allocated の原因と対応

    iOSでの開発をしていると.表題のエラーが起こる場合があります. 原因 変数の型が静的割り当てになっていることが原因. 対応 変数の型をポインタ型にすると.エラーがなくなります.(変数の前に*をつける ...

  8. 游戏中网络数据包和HTTP数据的思考

    快下班了,对于这个沙盒类文字游戏,其实考虑的东西还是很多的,服务器的架构,NPC, NPC API的运算,等等等 现在在思考大数据传输,比如背包数据或者拍卖行的商品展示数据在传输的时候的性能问题 目前 ...

  9. [LeetCode]题解(python):148-Sort List

    题目来源: https://leetcode.com/problems/sort-list/ 题意分析: 用nlog(n)的时间复杂度实现一个链表的排序. 题目思路: 用归并排序的思想,将链表用快慢指 ...

  10. c++中多态性、dynamic_cast、父类指针、父类对象、子类指针、子类对象

    c++多态性是依靠虚函数和父类指针指向子类对象来实现的.简单来说,父类中定义虚函数,父类指针指向子类对象,父类指针调用函数时调用的就是子类的函数. 父类没有定义虚函数,父类指针指向子类对象时,父类指针 ...