- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时,我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
我已经在 Firefox 上尝试了以下 HTML。 .case-1
和 .case-2
都有效。但是在 Chrome 中,这两个背景图片都不可见:
.case-1 {
width: 100px;
height: 100px;
border: 1px solid black;
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%20style%3D%22fill%3A%23000%3B%22%20height%3D%22%22%20width%3D%22%22%3E%20%3Cpath%20d%3D%22M17.316%206.246c.008.162.01.326.01.488%200%204.99-3.796%2010.742-10.74%2010.742-2.132%200-4.115-.625-5.786-1.697.296.033.596.05.9.05%201.77%200%203.397-.603%204.688-1.614-1.65-.03-3.046-1.12-3.526-2.62.23.042.467.065.71.065.345%200%20.68-.044.995-.13C2.84%2011.18%201.54%209.658%201.54%207.828V7.78c.508.284%201.09.454%201.71.474-1.014-.678-1.68-1.832-1.68-3.143%200-.69.185-1.34.51-1.896C3.943%205.498%206.726%207%209.863%207.158c-.064-.277-.097-.564-.097-.86%200-2.085%201.69-3.774%203.774-3.774%201.085%200%202.066.457%202.755%201.19.86-.17%201.667-.483%202.397-.915-.282.88-.88%201.62-1.66%202.086.764-.092%201.49-.293%202.168-.594-.506.758-1.146%201.422-1.884%201.953z%22%2F%3E%3C%2Fsvg%3E);
}
.case-2 {
width: 100px;
height: 100px;
border: 1px solid black;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgc3R5bGU9ImZpbGw6IzAwMDsiIGhlaWdodD0iIiB3aWR0aD0iIj4gPHBhdGggZD0iTTE3LjMxNiA2LjI0NmMuMDA4LjE2Mi4wMS4zMjYuMDEuNDg4IDAgNC45OS0zLjc5NiAxMC43NDItMTAuNzQgMTAuNzQyLTIuMTMyIDAtNC4xMTUtLjYyNS01Ljc4Ni0xLjY5Ny4yOTYuMDMzLjU5Ni4wNS45LjA1IDEuNzcgMCAzLjM5Ny0uNjAzIDQuNjg4LTEuNjE0LTEuNjUtLjAzLTMuMDQ2LTEuMTItMy41MjYtMi42Mi4yMy4wNDIuNDY3LjA2NS43MS4wNjUuMzQ1IDAgLjY4LS4wNDQuOTk1LS4xM0MyLjg0IDExLjE4IDEuNTQgOS42NTggMS41NCA3LjgyOFY3Ljc4Yy41MDguMjg0IDEuMDkuNDU0IDEuNzEuNDc0LTEuMDE0LS42NzgtMS42OC0xLjgzMi0xLjY4LTMuMTQzIDAtLjY5LjE4NS0xLjM0LjUxLTEuODk2QzMuOTQzIDUuNDk4IDYuNzI2IDcgOS44NjMgNy4xNThjLS4wNjQtLjI3Ny0uMDk3LS41NjQtLjA5Ny0uODYgMC0yLjA4NSAxLjY5LTMuNzc0IDMuNzc0LTMuNzc0IDEuMDg1IDAgMi4wNjYuNDU3IDIuNzU1IDEuMTkuODYtLjE3IDEuNjY3LS40ODMgMi4zOTctLjkxNS0uMjgyLjg4LS44OCAxLjYyLTEuNjYgMi4wODYuNzY0LS4wOTIgMS40OS0uMjkzIDIuMTY4LS41OTQtLjUwNi43NTgtMS4xNDYgMS40MjItMS44ODQgMS45NTN6Ii8+PC9zdmc+);
}
<div class="case-1"></div>
<div class="case-2"></div>
仅供引用,背景图像是带有此 SVG 源代码的 Twitter Logo :
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" style="fill:#000;" height="" width="">
<path d="M17.316 6.246c.008.162.01.326.01.488 0 4.99-3.796 10.742-10.74 10.742-2.132 0-4.115-.625-5.786-1.697.296.033.596.05.9.05 1.77 0 3.397-.603 4.688-1.614-1.65-.03-3.046-1.12-3.526-2.62.23.042.467.065.71.065.345 0 .68-.044.995-.13C2.84 11.18 1.54 9.658 1.54 7.828V7.78c.508.284 1.09.454 1.71.474-1.014-.678-1.68-1.832-1.68-3.143 0-.69.185-1.34.51-1.896C3.943 5.498 6.726 7 9.863 7.158c-.064-.277-.097-.564-.097-.86 0-2.085 1.69-3.774 3.774-3.774 1.085 0 2.066.457 2.755 1.19.86-.17 1.667-.483 2.397-.915-.282.88-.88 1.62-1.66 2.086.764-.092 1.49-.293 2.168-.594-.506.758-1.146 1.422-1.884 1.953z"/>
</svg>
我已经根据 w3c validator 检查了这个及其有效。
有什么建议吗?
最佳答案
“”的宽度和“”的高度实际上是无效的。 w3c 验证器 doesn't validate attribute values ,只是元素和属性名称。
Firefox 将 100% 替换为无效值,Chrome 也应该这样做,但显然做了其他事情。你可以 report that as a bug .
我已经更正了下面的缺失值。
.case-1 {
width: 100px;
height: 100px;
border: 1px solid black;
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%20style%3D%22fill%3A%23000%3B%22%20height%3D%22100%%22%20width%3D%22100%%22%3E%20%3Cpath%20d%3D%22M17.316%206.246c.008.162.01.326.01.488%200%204.99-3.796%2010.742-10.74%2010.742-2.132%200-4.115-.625-5.786-1.697.296.033.596.05.9.05%201.77%200%203.397-.603%204.688-1.614-1.65-.03-3.046-1.12-3.526-2.62.23.042.467.065.71.065.345%200%20.68-.044.995-.13C2.84%2011.18%201.54%209.658%201.54%207.828V7.78c.508.284%201.09.454%201.71.474-1.014-.678-1.68-1.832-1.68-3.143%200-.69.185-1.34.51-1.896C3.943%205.498%206.726%207%209.863%207.158c-.064-.277-.097-.564-.097-.86%200-2.085%201.69-3.774%203.774-3.774%201.085%200%202.066.457%202.755%201.19.86-.17%201.667-.483%202.397-.915-.282.88-.88%201.62-1.66%202.086.764-.092%201.49-.293%202.168-.594-.506.758-1.146%201.422-1.884%201.953z%22%2F%3E%3C%2Fsvg%3E);
}
.case-2 {
width: 100px;
height: 100px;
border: 1px solid black;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgc3R5bGU9ImZpbGw6IzAwMDsiIGhlaWdodD0iMTAwJSIgd2lkdGg9IjEwMCUiPiA8cGF0aCBkPSJNMTcuMzE2IDYuMjQ2Yy4wMDguMTYyLjAxLjMyNi4wMS40ODggMCA0Ljk5LTMuNzk2IDEwLjc0Mi0xMC43NCAxMC43NDItMi4xMzIgMC00LjExNS0uNjI1LTUuNzg2LTEuNjk3LjI5Ni4wMzMuNTk2LjA1LjkuMDUgMS43NyAwIDMuMzk3LS42MDMgNC42ODgtMS42MTQtMS42NS0uMDMtMy4wNDYtMS4xMi0zLjUyNi0yLjYyLjIzLjA0Mi40NjcuMDY1LjcxLjA2NS4zNDUgMCAuNjgtLjA0NC45OTUtLjEzQzIuODQgMTEuMTggMS41NCA5LjY1OCAxLjU0IDcuODI4VjcuNzhjLjUwOC4yODQgMS4wOS40NTQgMS43MS40NzQtMS4wMTQtLjY3OC0xLjY4LTEuODMyLTEuNjgtMy4xNDMgMC0uNjkuMTg1LTEuMzQuNTEtMS44OTZDMy45NDMgNS40OTggNi43MjYgNyA5Ljg2MyA3LjE1OGMtLjA2NC0uMjc3LS4wOTctLjU2NC0uMDk3LS44NiAwLTIuMDg1IDEuNjktMy43NzQgMy43NzQtMy43NzQgMS4wODUgMCAyLjA2Ni40NTcgMi43NTUgMS4xOS44Ni0uMTcgMS42NjctLjQ4MyAyLjM5Ny0uOTE1LS4yODIuODgtLjg4IDEuNjItMS42NiAyLjA4Ni43NjQtLjA5MiAxLjQ5LS4yOTMgMi4xNjgtLjU5NC0uNTA2Ljc1OC0xLjE0NiAxLjQyMi0xLjg4NCAxLjk1M3oiLz48L3N2Zz4=);
}
<div class="case-1"></div>
<div class="case-2"></div>
关于html - 以 SVG 作为数据 URL 的 CSS 背景在 Chrome 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47007792/
假设我拥有域 mydomain.com,并且我在服务器上有一个 Web 应用程序,网址为 http://99.99.99.99:1234/MyApplication/startpage.somethi
我正在尝试通过以下方式更新已解析的 URL: u, _ := url.Parse(s) if u.Scheme == "" { u.Scheme = "https" } if u.Path =
如何将 www.somesite.com/api(.*) 映射到 www.somesite.com/$1:9000? (我需要将/api 映射到运行 @ 端口 9000 的 Play 框架应用程序)
我有一个资源结构,如航类 > 座位 > 预订,所以预订属于某个航类的某个座位: http://example.com/jdf_3prGPS4/1/jMBDy46PbNc
我想知道以下网址是否有效。 路径中的点,在主机之后: http://www.example.com/v.b.w..com 主机中的点,作为子域的一部分: http://v.b.w..co.manufa
我有两个域 - crmpicco.co.uk 和 ayrshireminis.com - 如果我浏览到: www.crmpicco.co.uk/mini/new我希望能够重定向到 www.ayrshi
我正在尝试使用 URL 重写和应用程序请求路由来重写到外部 URL。我设置了以下规则: 在规则中,“patternToMatch”是我试
我已经安装了带有 SharePoint 和 Url Rewrite 模块的 IIS 7.0。 是以下句子还是我配置错误才能看到这个结果? Url Redirect 可以将 url 重定向到任何内部(在
我想知道,为了获得良好的 SEO,您必须在 URL 中使用自然语言。您知道字符中单词或短语的最大大小吗?例如: www.me.com/this-is-a-really-long-url.htm 我问这
有人知道在 SEO 友好 URL 中使用逗号有什么问题吗?我正在使用一些在其 SEO 友好 URL 中使用大量逗号的软件;但我 100% 肯定我见过一些程序/平台无法正确识别 URL 并在第一个逗号后
我有一个网站,我正在为所有链接使用干净的 URL。我想知道对于简短的基本 URL 与较长的描述性 URL 有何看法。 例如,如果我的网站是关于 Georgia Bulldog 足球新闻的,那么哪个网站
我正在编写一个类似于 tinyurl 的 URL 缩短器,我想知道如何跟踪已经使用我的服务缩短的 URL?例如,tinyurl 为相同的长 URL 生成相同的小 URL,而不管是谁创建的。如
我是 magento 的新手。我正在开发一个模块。为此,我有一些要显示链接的 css 和 js 文件。我目前有类似 的链接 getSkinUrl('module_tryouts/css/jquery.
我想基于 HTTP_URL 重写 URL 以重定向到不同的端口,同时保留其余的 URL 和查询字符串(如果指定)。例如, http://host/john/page.aspx 应该重定向到 http:
我遇到了以下问题: 我的 Grails (2.2.0) 应用程序具有以下 URL 映射: "/api/clientQuote/$labcode/$cliCode/$quoCode"(controlle
我有一个很长的 URL,它不适合 URL 字段。它一直在修剪。该怎么办?有没有办法增加 SharePoint 2010 中的 URL 字段字符限制? 或者解决方法来容纳长 URL。例如,以下 URL
关闭。这个问题是off-topic .它目前不接受答案。 想改进这个问题? Update the question所以它是on-topic对于堆栈溢出。 9年前关闭。 Improve this que
我们从客户以前的开发人员那里继承了相当多的 Google Apps 脚本项目。 Apps 脚本通过嵌入式小部件部署在 Google 网站 (sites.google.com) 的各个页面上。每当我们需
我正在编写一些文档,但遇到了一些词汇问题: http://www.example.com/en/public/img/logo.gif 被称为“绝对”网址,对吗? ../../public/img/l
我们从客户以前的开发人员那里继承了相当多的 Google Apps 脚本项目。 Apps 脚本通过嵌入式小部件部署在 Google 网站 (sites.google.com) 的各个页面上。每当我们需
我是一名优秀的程序员,十分优秀!