解决错误：“废弃 document 元素之后的内容”——HTML5新特性，局部样式表

标签：style   blog   color   使用   ar   文件   sp   div   问题   

　　最近正在学习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新特性，局部样式表

标签：style   blog   color   使用   ar   文件   sp   div   问题   

原文地址：http://www.cnblogs.com/dajianshi/p/3997922.html