`
A牛哥哥
  • 浏览: 150596 次
社区版块
存档分类
最新评论

background-size 失效

background-size 失效background-size 无效 
阅读更多
对前端不太懂，在使用background-size 时发现无效，用什么值都没作用，最后把background-size放到了background:url(xxx) 的后面就生效了，就是

这样写的话 background-size 没效果
{
background-size:contain;
background:url(xxx);
}

把两个交换下顺序，即换成下面这样就生效了
{
background:url(xxx);
background-size:contain;
}
分享到：
| centos防火墙启用、关闭、禁用或开启端口
评论
1 楼 wenxin667 2019-01-23  
正解，感谢博主
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    border-radius失效

    确保图片大小与元素完全匹配，并且没有超出元素的边界，或者使用`background-size: cover`或`contain`来调整背景图片的尺寸。 4. **绝对定位和浮动**：有时，元素的`position`属性被设置为`absolute`或`fixed`，...

    BAT各大互联网面试题

    background-size: cover; background-position: center; -webkit-animation-name: "loops"; -webkit-animation-duration: 20s; -webkit-animation-iteration-count: infinite; } @-webkit-keyframes "loops...

    layer弹出层中H5播放器全屏出错的解决方法

    通过移除相关CSS类并利用CSS的`background-size: cover`属性，我们可以解决这两个问题，确保视频播放器的全屏功能正常，并且预览图能完美适应容器大小。这为在layer弹出层中提供良好的H5视频体验提供了有效解决方案...

    详解css3 object-fit属性

    CSS3 background-size出现的比较早，大家应该知道其支持的一些值，除了数值之外，其还支持几个关键字，例如：cover, contain等。 object-fit也是类似的，但还是有些差异，具体有5个值： .fill { object-fit: fill; }...

    背景图片自动调整大小

    例如，使用`background-size: cover`可以使背景图片自动填充容器，而使用`background-size: contain`则可以使图片按比例缩放以适应容器大小。 #### 结论 通过本文介绍的`AlphaImageLoader`滤镜技术，开发者可以在...

    CSS知识汇总.docx

    3. 背景：`background`为复合属性，包括`background-color`、`background-image`、`background-position`和`background-repeat`。 4. 列表样式：`list-style`可以设置为`none`以移除列表样式，`list-style-type`（如...

    table设置背景图片，不能100%显示解决方法

    - 如果希望背景图片始终铺满单元格，可以使用CSS3的`background-size`属性，如`background-size: cover;`。这将使背景图片根据单元格的大小进行缩放，确保完全覆盖。 6. **浏览器兼容性**： - 不同浏览器对CSS...

    PNG背景在不同浏览器下的应用

    它们不仅支持PNG24的完全透明，还支持CSS3的`background-image`、`background-repeat`、`background-position`以及`background-size`属性，允许开发者更灵活地控制背景图像的显示。此外，CSS3还引入了`background-...

    关于css中line-height(行高)设置无效的问题的解决方法

    在CSS中，`font`的语法是这样的：`font: [font-style] [font-variant] [font-weight] [font-size] / [line-height] [font-family];` 注意这里有一个可选的`/ line-height`部分，它允许在`font`声明中直接指定`line-...

    css试题及答案.pdf

    7. 错误的背景属性描述是`background-width`，正确的属性应该是`background-size`。 8. 取消字体加粗样式的声明是`font-weight:normal;`。 9. 控制单词间距的CSS属性是`word-spacing:`。 10. `display`属性有多种...

    net架构练习题

    --这是--注释-->`：注释中间不应该出现`--`，否则会导致注释失效。 - C. `/*这是注释*/`：这是CSS或JavaScript中的注释格式，而非HTML。 - D. `<!--这是注释-->`：正确答案，这是**HTML中有效的注释声明**。 ### ...

    css入门笔记

    属性：background-size: 取值： 1.width hegiht 2.width% height% 3.cover 将背景图等比放大，直到背景图完全覆盖到元素的所有区域为止 4.contain 将背景图等比放大；直到背景图片碰到某个边缘位置 5.背景...

    Javascript知识点汇总.pdf

    13. **常用样式设置**：包括颜色（`color`）、背景（`background-color`、`background-image`）、边框（`border`）、文本样式（`font-family`、`font-size`）、布局属性（`margin`、`padding`、`width`、`height`）...

    DIV多层嵌套margin-top的BUG问题

    background-color: #FFCCCC; color: #F00; font-size: 12px; border: #FF0000 solid 1px; margin-top: 10px; /* 这里是问题所在 */ } ``` 在上述代码中，`.errorstyle`元素的`margin-top`在Firefox和IE8中会...

    ASPX (VB) 下拉框（含搜索）样式表

    // 这里要加上 px, 否则在 Firefox 就会失效 obj.style.top = y + rela.offsetHeight + "px"; } function startRequest(value) { // 异步请求代码... } ``` ##### 3. 服务器端处理 在服务器端，我们使用VB...

    jQuery完全实例.rar

    $(document.body).css( "background", "black" ); -------------------------------------------------------------------------------- 隐藏一个表单中所有元素。 jQuery 代码: $(myForm.elements).hide() ...

    CSS 分号引起页面混乱

    在这个例子中，`color`, `font-size`, 和 `background-color` 是三个独立的声明，每个声明后面都跟了一个分号，表示该声明的结束。如果没有分号，浏览器将无法正确解析后面的声明，可能会导致样式失效或者出现意外的...

    项目笔记项目笔项目笔记记

    - **Margin 失效**：在某些情况下，例如当元素使用 `display:table-cell` 时，可能会出现 margin 失效的情况。这时可以通过调整 `display` 属性或者使用 `padding` 来代替 `margin` 解决。 - **Overflow 与 Padding*...

Magicbox
Global site tag (gtag.js) - Google Analytics