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. Windows交叉编译MNN-3.0.0安卓版本库

    一.写在前面 以下的步骤.流程都是基于MNN的文档,再结合自己的实践得出的,仅作为参考. 博主的环境是windows10专业版 MNN文档 MNN的Github仓库地址 二.下载MNN-3.0.0主库 ...

  2. 用EwoMail开源版搭建邮箱服务器

    介绍: EwoMail是基于Linux的开源邮件服务器,支持一键搭建,集成了众多优秀稳定的组件,是一个快速部署.简单高效.安全稳定的邮件解决方案,支持电脑和手机的客户端,适合个人或邮箱功能需求少的企业 ...

  3. Qt开源作品40-图片及文字与base64编码互换

    一.前言 对于图片的传输,通俗的做法一般有两种,一种是直接二进制文件传输,比如先传输开始标记,带文件名称.文件字节长度,然后挨个分包发送.最后发送文件结束标记,这种方式必须要求接收方按照自己定义的规则 ...

  4. 如何在众多Ubuntu版本中挑选出最适配自身需求的系统版本?用德承工控机GM-1100来深度剖析其中的门道

    Ubuntu是一款基于Debian GNU/Linux,支持x86.amd64(x64)和ppc架构,以桌面应用为主的Linux操作系统.其名称来自非洲南部的语言"ubuntu"( ...

  5. ubuntu opencv安装与卸载

    安装opencv 1.在下面网站上下载所需版本的源文件Releases - OpenCVhttps://opencv.org/releases/ 2.解压并进入该文件夹 3.命令行执行如下指令    ...

  6. 融云技术分享:基于WebRTC的实时音视频首帧显示时间优化实践

    本文由融云技术团队原创投稿,作者是融云WebRTC高级工程师苏道,转载请注明出处. 1.引言 在一个典型的IM应用里,使用实时音视频聊天功能时,视频首帧的显示,是一项很重要的用户体验指标. 本文主要通 ...

  7. CDS标准视图:安排维护计划的调用 I_MAINTENANCEPLANSCHEDULE

    视图名称:安排维护计划的调用 I_MAINTENANCEPLANSCHEDULE 视图类型: 视图代码: 点击查看代码 @AbapCatalog.compiler.compareFilter: tru ...

  8. abp.vNext mvc版中的js和css

    在创建vNextmvc版本后运行起来,F12可以看到如下js.css请求 这些文件来源: XXXX.Web/libs文件夹 /libs/abp/aspnetcore-mvc-ui-theme-shar ...

  9. 安装Jenkins,并部署vue前端,java后台

    Jenkins 安装方式为Docker或war包. Publish Over SSH 插件下架后,Docker部署加ssh远程执行目前没找到合适的替代方案. 我选择的方案为:jenkins和应用服务器 ...

  10. Java常用的并发类-总结列表

    一.java集合框架概述 java集合可分为Collection和Map两种体系,其中: 1.Collection接口:单列数据,定义了存取一组对象的方法的集合: List:元素有序.可重复的集合 S ...