react项目中，使用styled-components编写样式，给元素添加背景图不生效。



background直接设置十六进制颜色或者颜色的英文名称都是可行的，但是使用url无作用，那就是url问题了，于是我想换一种思路，能不能把图片import进来，放进url里，避免错误的路径呢，于是



哎嘿，好使了

css设置backgroud：url(),无效的更多相关文章

  1. CSS设置height为100%无效的情况

    CSS设置height为100%无效的情况 笔者是小白,不是特别懂前端.今天写一个静态的HTML页面,然后想要一个div占据页面的100%,但是尝试了很多办法都没有实现,不知道什么原因. 后来取百度搜 ...

  2. 设置height:100%无效的解决方法

    设置height:100%无效的解决方法 刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:" ...

  3. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  4. css 设置背景图片模糊，内容不模糊

    需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...

  5. 解决body设置height:100%无效问题

    1. 解决html设置height:100%无效问题 通常我们需要让自己的网页内容能够更好的适配各种屏幕大小,会采用height:100%,但是我们发现问题出来了,height:100%无效,其实解决 ...

  6. css设置背景固定不滚动效果的示例

    css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...

  7. webpack生成的css文件background-image url图片无法加载

    之前在使用webpack3构建基于less预处理的项目时,在对指定的元素使用background-image: url(xxx)来设置背景图片时,本地开发是ok的,但是在项目编译产出后背景图片就找不到 ...

  8. @Html.DropDownList 设置选中值无效

    有时候在ASP.NET  MVC中用@Html.DropDownList 设置选中值无效,如图: 具体原因说不清,反正只要改个名字就行了!!!,如图:::

  9. CSS设置滚动条样式

    因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决. 比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览器的.如图所示: ...

  10. 关于使用Css设置Canvas画布大小的问题

    问题分析 我们在调整画布大小时,希望画布中的图形保持不变,只是改变画布本身的大小.但是如果使用Css设置画布大小,则会出现问题. 问题描述 如果使用Css设置Canvas画布的大小,则导致画布按比例缩 ...

随机推荐

  1. Qt/C++地图动态绘制折线多边形矩形圆形标注点/可编辑拖动调整大小和位置

    一.前言说明 无论哪一家的地图,都提供了调用函数绘制各种覆盖物,但是有时候的场景是希望进入添加覆盖物模式,然后每次在地图上按下都自动生成对应的覆盖物比如圆形,这样就不需要用户提前知道经纬度坐标等参数, ...

  2. Qt编写的项目作品37-安卓综合应用示例

    一.功能特点 封装了通用的Qt安卓组件,打通了常规与java交互机制. 动态切换横屏竖屏及获取当前横屏竖屏状态. 支持手机震动.拨打电话.发送短信. 支持moketoast临时消息.notify顶部任 ...

  3. Qt编写安防视频监控系统34-onvif事件订阅

    一.前言 事件订阅是近期增加的功能,主要是因为遇到越来越多的一个应用场景,能够接收摄像机的报警事件,比如几乎所有的摄像机后面会增加报警输入输出接口,如果用户外接了报警输入,则当触发报警以后,对应的事件 ...

  4. ThreeJs-09精通粒子特效

    一.初识points与点材质 什么叫做点材质,之前说过所有物体都是有定点的比如一个球体,并且将材质设置为线框模式,这个之前就说过所有mesh物体都是由三角形构成,都是有顶点的 我们也可以创建点物体,电 ...

  5. 不为人知的网络编程(十八)：UDP比TCP高效？还真不一定！

    本文由LearnLHC分享,原始出处:blog.csdn.net/LearnLHC/article/details/115268028,本文进行了排版和内容优化. 1.引言 熟悉网络编程的(尤其搞实时 ...

  6. NET Core3.1 Cors 添加跨域支持

    在 Startup 里加: services.AddCors(options => options.AddPolicy( DefaultCors, p => p.SetIsOriginAl ...

  7. SpringBoot(四) - 整合Mybatis,逆向工程,JPA,Mybatis-plus

    1.SpringBoot整合MyBatis 1.1 application.yml # 数据源配置 spring: datasource: driver-class-name: com.mysql.c ...

  8. 免费的天气接口api(腾讯)

    请求URL: https://wis.qq.com/weather/common请求方式: GET参数: 参数名 必选 类型 说明 source 是 string pc weather_type 是 ...

  9. Nessus 扫描Web服务

    Nessus 扫描Web服务 1.点击 New Scan,选择 Web Application Tests 2.填写扫描名称和扫描目标 3.点击 Discovery ,选择 Scan Type 为全端 ...

  10. Presto常用命令

    一.基本资料 1.官方文档 https://prestodb.github.io/docs/current/sql/select.html 二.常用命令 1.kill任务,登录presto客户端 CA ...