一个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失效的更多相关文章

  1. HTML <base> 标签的 href 属性

    为页面上所有相对 URL 规定基准 URL: <head> <base href="http://www.w3school.com.cn/i/" /> &l ...

  2. 使用xpath提取页面所有a标签的href属性值

    # -*- coding: utf-8 -*- #1.选取节点 #获取所有的div元素 //div #/代表获取根节点的直接子元素 #获取所有带有id属性的div //div[@id] #2.谓词(索 ...

  3. <a>标签的href属性

    <a> 标签的 href 属性用于指定超链接目标的 URL. 语法 <a href="value"> 属性值 值 描述 URL 超链接的 URL.可能的值: ...

  4. a标签中href属性引起的页面不跳转问题

    先简单描述问题,今天在做一个简单的提交页面的时候,碰到了跳转不了的问题.其中a标签的形式<a href="" onclick="submit()"> ...

  5. HTML5 超链接：a标签的href 属性

    H5中a标签的 href 属性用于指定超链接目标的 URL,这里主要给大家介绍一下 href 属性的定义和用法以及应用实例. 定义和用法: <a> 标签的 href 属性用于指定超链接目标 ...

  6. <a>标签缺少href 属性，鼠标经过不会出现手型

    声明: web小白的笔记,欢迎大神指点.联系QQ:1522025433. 直接看实例吧! <!doctype html> <html> <head> <met ...

  7. 关于a标签的href属性

    今天有人问起我a标签的href属性值为 # 与 JavaScript:void(0) 有啥区别,想来也没啥可说,就简单说两句 a标签的href属性,优点有: 天然鼠标手型,以及可以被键盘focus以及 ...

  8. js 重写a标签的href属性和onclick事件

    适应场景:假如移动端拨打电话,需要给a标签添加href属性,但是由于需求,需要链接跳转的同时给a标签添加onclick事件,如果不做任何处理的话,默认执行点击事件,而不会跳转href属性的链接. 怎么 ...

  9. javascrip标签的href属性

    1.标签的href属性用于指定超链接目标的URL.href属性的值可以是任何有效文档的相对或绝对URL,包括片段ID和javascript代码段. 2.javascript:这是一个虚假的协议.所谓的 ...

随机推荐

  1. [置顶] Hibernate从入门到精通（五）一对一单向关联映射

    上次的博文中Hibernate从入门到精通(四)基本映射我们已经讲解了一下基本映射和相关概念,接下来我们会讲稍微复杂点的映射——关系映射. 关系映射分类 关系映射即在基本映射的基础上处理多个相关对象和 ...

  2. mysql源码安装（5.1）

    下载mysql源码包并解压.wget http://dev.mysql.com/get/Downloads/MySQL-5.1/mysql-5.1.73.tar.gztar -zxvf mysql-5 ...

  3. PropertyGrid—添加属性Tab

    零.引言 PropertyGrid用来显示和编辑对象的属性,前面已经简单介绍了如何使用该控件和提供不同的属性编辑方法.前面主要讲如何使用该控件,但有时,该控件无法满足我们的需求,就需要对其进行扩展.本 ...

  4. C# 和Java的foreach的不同用法

    循环语句为苦逼的程序猿们提供了很大的便利,有while.do...while.for和 foreach.而且foreach语句很简洁,但是它的优点不仅仅在于此,它的效率也是最高的. 作为两个开发语言, ...

  5. [转]用apache反向代理解决单外网ip对应内网多个web主机的问题

    用apache反向代理解决单外网ip对应内网多个web主机的问题 转载一个有独立外网IP,需内网服务器对外发布的例子,是应用apache虚拟主机的. 来源地址:http://www.itshantou ...

  6. canvas入门

    <html> <head> <script> window.onload=function(){ var canvas=document.getElementByI ...

  7. html 基础之 <link>标签

    实例 链接一个外部样式表: <head> <link rel="stylesheet" type="text/css" href=" ...

  8. 屏蔽鼠标右键功能JS

    <script language="Javascript">     function hiderightKey(){    return false; } docum ...

  9. jQuery EasyUI API 中文文档 - 面板（Panel）

    Panel 面板   用$.fn.panel.defaults重写defaults. 用法示例 创建Panel 1. 经由标记创建Panel 从标记创建Panel更容易.把 'easyui-panel ...

  10. HTML5的结构学习(1) --- 新增的主体结构元素

      1.article 元素 解释:代表文档.页面和应用程序中独立的.完整的.可以被独自引用的内容. 主要用途:博客中的文章.评论,贴吧中的帖子,或者独立的插件等. article中可以包含多种元素例 ...