最近正在学习angularjs,不过本文和angularjs没多大关系。在学习使用route和ng-view使用模版之后,发现view装载之后,firefox都会报个错误“废弃 document 元素之后的内容”,虽然页面正常运行,不过总是看着别扭:(。

  仔细查看后,发现报错之处指向了样式表标签style的结束处,这才反应过来:原来是完整html页面,样式表在head标签之中没有问题,可是现在这些各个view模版自己使用的一些样式就直接写到了模版中,因此不在整个页面的Head之中,html协议是不支持的!虽然这些style都是很简单的,局部功能专用的,但是以前如果想要解决此问题,都只能是建立一个app的整个style文件,使用class的方式解决,需要起个每个功能的样式专用的名字,再给每个元素引用,可是这样一来不但麻烦,而且麻烦!因为不能给元素写通用的样式了!很不甘心,就去W3School,仔细研究了一下html5的文档,发现HTML5已经支持局部的样式表了^_^。不过有两点要求,第一需要放在一个父元素之内,第二添加属性scoped。改造好的模版如下:

<div id="view-xxx">
<style scoped="scoped">
A{}
thead tr{}
tbody tr{}
</style>
...
</div><!-- end of view -->

  重新载入看看,完美解决!

解决错误:“废弃 document 元素之后的内容”——HTML5新特性,局部样式表的更多相关文章

  1. JDK各版本内容和新特性

    JDK各版本内容和新特性 - yanlzhl - 博客园 https://www.cnblogs.com/yanlzhl/articles/5694470.html    版本JDK1.0:1995年 ...

  2. html5新特性:利用history的pushState等方法来解决使用ajax导致页面后退和前进的问题

    一.背景 使用ajax,可以实现不需要刷新整个页面就可以进行局部页面的更新.这样可以开发交互性很强的富客户端程序,减少网络传输的内容.但长期以来存在一个问题,就是无法利用浏览器本身提供的前进和后退按钮 ...

  3. 解决低版本IE关于html5新特性的兼容性问题html5shiv.js和Respond.js,以及excanvas.js解决低版本IE不支持canvas的问题

    插件:html5shiv.js 让IE9以下版本支持html5新标签,git地址https://github.com/aFarkas/html5shiv 用于解决IE9以下版本浏览器对HTML5新增标 ...

  4. html5新特性-header,nav,footer,aside,article,section等各元素的详解

    Html5新增了27个元素,废弃了16个元素,根据现有的标准规范,把HTML5的元素按优先级定义为结构性属性.级块性元素.行内语义性元素和交互性元素四大类. 下面是对各标签的详解,section.he ...

  5. HTML5新特性:元素的classList属性与应用

    在html5新增的classList之前, 操作元素的class用的是className这个属性,而如果要向jquery封装的hasClass, removeClass, addClass, togg ...

  6. [Web] HTML5新特性history pushState/replaceState解决浏览器刷新缓存

    转载: https://www.jianshu.com/p/cf63a1fabc86 现实开发中,例如‘商品列表页’跳转‘商品详情页’,返回时,不重新加载刷新页面,并且滚动到原来的位置. 1.首先,先 ...

  7. HTML5新特性postMessage解决跨域

    window.postMessage的功能是允许程序员跨域在两个窗口/frames间发送数据信息.基本上,它就像是跨域的AJAX,但不是浏览器跟服务器之间交互,而是在两个客户端之间通信.让我们来看一下 ...

  8. html 5中的新特性之强化表单元素及属性

    之前我们判断用户提交的是否是Email 的时候,往往使用js 进行判断,但在html5中可以有新的方式进行判断而且更简单 <!DOCTYPE html> <html lang=&qu ...

  9. 10个html5增加的重要新特性和内容

    文章开篇之前我们先了解一下什么是html5,百度上是这样定义html5的:万维网的核心语言.标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改. 其实说白了html5也就是人为定义 ...

随机推荐

  1. 【转】亲测plsql Developer配置免安装oralce客户端步骤

    原文地址:http://blog.csdn.net/bushy0401/article/details/11869461 再次用到Oracle了,机器上面也没有oracle客户端,还得去网上下载,直接 ...

  2. [转]oracle 11g jdbc jar包在哪个文件目录

    oracle 11g jdbc jar包在哪个文件目录 一. 如果装了Oracle数据库的话, 大致是这样的目录:     D:\oracle\product\11.2.0\client_1\oui\ ...

  3. springboot 使用c3p0数据库连接池

    springboot 使用c3p0数据库连接池的方法  本文转自:http://www.cnblogs.com/xiaosiyuan/p/6255292.html 使用springboot开发时,默认 ...

  4. VS2013代码调试:[7]如何避免调试时加载符号

    调试的时候不小心点了个东西,然后就花很长时间加在各种dll 解决办法: 1.点 调试2.然后 选项和设置3.右边勾上 启用源服务器支持4.左边点 符号5.把微软符号服务器勾6.运行的时候等一下 莫慌! ...

  5. Exception in thread "main" java.lang.UnsatisfiedLinkError: org.apache.hadoop.io .nativeio.NativeIO$Windows.createDirectoryWithMode0(Ljava/lang/String;I)V

    首先,遇到这个问题的一个原因是windows环境中没有配置hadoophome.配置之后加入winutils工具 第二个原因,pom中执行的hadoop的版本与window环境中的hadoop的版本不 ...

  6. CAS (10) —— JBoss EAP 6.4下部署CAS时出现错误exception.message=Error decoding flow execution的解决办法

    CAS (10) -- JBoss EAP 6.4下部署CAS时出现错误exception.message=Error decoding flow execution的解决办法 jboss版本: jb ...

  7. 简单的Http请求数据保存到Hdfs

    使用okhttp工具集来开发:(如果文件已经存在会报错) package com.etl; import java.io.IOException; import org.apache.commons. ...

  8. 聊聊Java中的拆箱和装箱操作

    在刷谷歌面试题的过程中,发现一道有意思的题目,以前没有特别注意,忽略了一些东西,特此记录. 题目要求输出以下代码的结果: public class MyTest { public static voi ...

  9. java 、HashMap 和单例

    前段时间在项目中遇到一个问题.当多个系统同时运行时,大部分系统能够良好运转,部分却卡死在了启动界面.以下是我解决该问题的步骤和总结:   1.复现问题.重新走了一遍出问题的过程,发现问题的确存在.说明 ...

  10. Apche Kafka 的生与死 – failover 机制详解

    转自:http://www.cnblogs.com/fxjwind/p/4972244.html Kafka 作为 high throughput 的消息中间件,以其性能,简单和稳定性,成为当前实时流 ...