【27前端】base标签带有href属性会让chrome里的svg元素url失效
一个chrome的问题,但具体原因不明。
触发条件:chrome浏览器base标签里href属性有值的时候
触发问题:svg里面的元素如果有用url的滤镜和模糊,则会失效,在firefox里和IE10没有发现这个问题。
正常状态:

有base标签且href里值为“.”的时候chrome里的状态:

测试代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>chrome bug</title>
<style>
#svg{ width:500px; height:500px; display:block; margin:20px auto; background-color:#000; }
</style>
<!--当href=""里面有值的时候填写的url都会失效-->
<base href="." target="_blank"> <!--当href=""这样则不会-->
<!--<base target="_blank">-->
</head> <body>
<svg id="svg">
<defs>
<lineargradient id="blur1" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#FF0000;stop-opacity:0"></stop>
<stop offset="100%" style="stop-color:#FF0000;stop-opacity:1"></stop>
</lineargradient>
<filter id="Gaussian_Blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="3" />
</filter>
</defs> <circle cx="200" cy="50" r="40" style="stroke:url(#blur1); filter:url(#Gaussian_Blur); stroke-width:10; fill:yellow; "/>
<line x1="0" y1="0" x2="300" y2="300" style="stroke:url(#blur1); stroke-width:2;" />
</svg>
</body>
</html>
具体原因不明,希望有大神赐教。
【27前端】base标签带有href属性会让chrome里的svg元素url失效的更多相关文章
- HTML <base> 标签的 href 属性
为页面上所有相对 URL 规定基准 URL: <head> <base href="http://www.w3school.com.cn/i/" /> &l ...
- 使用xpath提取页面所有a标签的href属性值
# -*- coding: utf-8 -*- #1.选取节点 #获取所有的div元素 //div #/代表获取根节点的直接子元素 #获取所有带有id属性的div //div[@id] #2.谓词(索 ...
- <a>标签的href属性
<a> 标签的 href 属性用于指定超链接目标的 URL. 语法 <a href="value"> 属性值 值 描述 URL 超链接的 URL.可能的值: ...
- a标签中href属性引起的页面不跳转问题
先简单描述问题,今天在做一个简单的提交页面的时候,碰到了跳转不了的问题.其中a标签的形式<a href="" onclick="submit()"> ...
- HTML5 超链接:a标签的href 属性
H5中a标签的 href 属性用于指定超链接目标的 URL,这里主要给大家介绍一下 href 属性的定义和用法以及应用实例. 定义和用法: <a> 标签的 href 属性用于指定超链接目标 ...
- <a>标签缺少href 属性,鼠标经过不会出现手型
声明: web小白的笔记,欢迎大神指点.联系QQ:1522025433. 直接看实例吧! <!doctype html> <html> <head> <met ...
- 关于a标签的href属性
今天有人问起我a标签的href属性值为 # 与 JavaScript:void(0) 有啥区别,想来也没啥可说,就简单说两句 a标签的href属性,优点有: 天然鼠标手型,以及可以被键盘focus以及 ...
- js 重写a标签的href属性和onclick事件
适应场景:假如移动端拨打电话,需要给a标签添加href属性,但是由于需求,需要链接跳转的同时给a标签添加onclick事件,如果不做任何处理的话,默认执行点击事件,而不会跳转href属性的链接. 怎么 ...
- javascrip标签的href属性
1.标签的href属性用于指定超链接目标的URL.href属性的值可以是任何有效文档的相对或绝对URL,包括片段ID和javascript代码段. 2.javascript:这是一个虚假的协议.所谓的 ...
随机推荐
- Calculation(dfs+状压dp)
Problem 1608 - Calculation Time Limit: 500MS Memory Limit: 65536KB Total Submit: 311 Accepted: ...
- rabbitmq-c初探
RabbitMQ着实是个好东西,当然了也有对C语言client开发的支持.例子和文档少的可怜,只能去项目里去查看example来理解,简单整理了一些,以免走些弯路.主要是在版本对应上,这点就没Mave ...
- webpack配合vue.js实现完整的单页面demo
本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的 ...
- gauge.js的应用
最近项目要做个手机端的仪表盘,但是画风太给力,echarts.highcharts.D3等等都不能满足业务的需求,你懂的!开找,找到个gauge.js 下面简单介绍下这个插件官网http://bern ...
- Graham算法—二维点集VC++实现
一.凸包定义 通俗的说就是:一组平面上的点,求一个包含所有点的最小凸多边形,这个最小凸多边形就是凸包. 二.Graham算法思想 概要:Graham算法的主要思想就是,最终形成的凸包,即包围所有点的凸 ...
- AUL使用初记
案例:部门有一个数据库因为机器无故重启,无法启动,初步判断是系统表空间出问题了.尝试过各种不同手段,均无法修复.后来发现上面只有一个用户的数据,遂想到直接通过AUL工具从数据文件中抽取出整个库. 准备 ...
- outlook 2007 IMAP设置和配置
以Outlook2007为例(Outlook2003操作基本类似). 1.依次点击“工具”>“帐户设置”. 2.在“帐户设置”页中点击“新建”> 不需要做任何选择,点击下一步. 3.填写 ...
- iOS Dev (20) 用 AVAudioPlayer 播放一个本地音频文件
iOS Dev (20) 用 AVAudioPlayer 播放一个本地音频文件 作者:CSDN 大锐哥 博客:http://blog.csdn.net/prevention 步骤 第一步:在 Proj ...
- 自定义View 一 (继承VIew重写onDraw方法)
项目:具有圆形效果的自定义View 一.继承View并重写onDraw方法 public class CircleView extends View{ private static final int ...
- The package does not support the device architecture (x86). You can change the supported architectures in the Android Build section of the Project Opt
The package does not support the device architecture (x86). You can change the supported architectur ...