解决错误:“废弃 document 元素之后的内容”——HTML5新特性,局部样式表
最近正在学习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新特性,局部样式表的更多相关文章
- JDK各版本内容和新特性
JDK各版本内容和新特性 - yanlzhl - 博客园 https://www.cnblogs.com/yanlzhl/articles/5694470.html 版本JDK1.0:1995年 ...
- html5新特性:利用history的pushState等方法来解决使用ajax导致页面后退和前进的问题
一.背景 使用ajax,可以实现不需要刷新整个页面就可以进行局部页面的更新.这样可以开发交互性很强的富客户端程序,减少网络传输的内容.但长期以来存在一个问题,就是无法利用浏览器本身提供的前进和后退按钮 ...
- 解决低版本IE关于html5新特性的兼容性问题html5shiv.js和Respond.js,以及excanvas.js解决低版本IE不支持canvas的问题
插件:html5shiv.js 让IE9以下版本支持html5新标签,git地址https://github.com/aFarkas/html5shiv 用于解决IE9以下版本浏览器对HTML5新增标 ...
- html5新特性-header,nav,footer,aside,article,section等各元素的详解
Html5新增了27个元素,废弃了16个元素,根据现有的标准规范,把HTML5的元素按优先级定义为结构性属性.级块性元素.行内语义性元素和交互性元素四大类. 下面是对各标签的详解,section.he ...
- HTML5新特性:元素的classList属性与应用
在html5新增的classList之前, 操作元素的class用的是className这个属性,而如果要向jquery封装的hasClass, removeClass, addClass, togg ...
- [Web] HTML5新特性history pushState/replaceState解决浏览器刷新缓存
转载: https://www.jianshu.com/p/cf63a1fabc86 现实开发中,例如‘商品列表页’跳转‘商品详情页’,返回时,不重新加载刷新页面,并且滚动到原来的位置. 1.首先,先 ...
- HTML5新特性postMessage解决跨域
window.postMessage的功能是允许程序员跨域在两个窗口/frames间发送数据信息.基本上,它就像是跨域的AJAX,但不是浏览器跟服务器之间交互,而是在两个客户端之间通信.让我们来看一下 ...
- html 5中的新特性之强化表单元素及属性
之前我们判断用户提交的是否是Email 的时候,往往使用js 进行判断,但在html5中可以有新的方式进行判断而且更简单 <!DOCTYPE html> <html lang=&qu ...
- 10个html5增加的重要新特性和内容
文章开篇之前我们先了解一下什么是html5,百度上是这样定义html5的:万维网的核心语言.标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改. 其实说白了html5也就是人为定义 ...
随机推荐
- JavaScript高级 面向对象(11)--对象的动态特性-关联数组用法
说明(2017.4.2): 1. 对象的动态特性: (1)在js中,一个对象需要属性,就可以利用“对象名.属性 = 值”的方式为其添加,只要赋值成功,对象就新增这个属性. (2)对象属性的访问形式: ...
- [转]Teleport Ultra/Teleport Pro的冗余代码批量清理方法
原文地址:http://www.abcd9.com/?post=402 Teleport Pro 是款优秀的网站离线浏览工具(即网站整站下载工具),Teleport Ultra是其增强版,但使用此系列 ...
- SOAPUI 測试Http 协义
眼下大多站点都是採用Http 协义的,那SOAPUI要怎样操作呢 网上好多是用谷歌做演示样例的,因为谷歌国内正常方式无法訪问,故下面将採用百度站点做演示样例 1:打开浏览器输入百度网址在文库中输入SO ...
- 【MySql 】is not allowed to connect to this MySql server 无法访问远程MySQL数据库
问题:访问远程MySQL数据库时报错[is not allowed to connect to this MySql server ]不允许访问,因为MySQL默认只有本机localhost能够访问M ...
- C语言 · 色盲的民主
算法提高 色盲的民主 时间限制:1.0s 内存限制:256.0MB 问题描述 n个色盲聚在一起,讨论一块布的颜色.尽管都是色盲,却盲得各不相同.每个人都有自己的主张,争论不休.最终, ...
- 谁能当IBM公司的CEO?
转自:http://www.ruanyifeng.com/blog/2005/09/ibmceo.html 阮一峰 创业文档 IBM公司的前CEO郭士纳在他的<谁说大象不能跳舞?>一书中 ...
- linux命令实现http的get和post请求
1. wget wget -O - "http://$IP/host" --header="Content-Type: application/json" - ...
- Java编程的逻辑 (40) - 剖析HashMap
本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http:/ ...
- oozie 重新提交作业
在oozie的运行过程当中可能会出现错误,比如数据库连接不上,或者作业执行报错导致流程进入suspend或者killed状态,这个时候我们就要分析了,如果确实是数据或者是网络有问题,我们比如把问题解决 ...
- 数据採集之Web端上传文件到Hadoop HDFS
前言 近期在公司接到一个任务.是关于数据採集方面的. 需求主要有3个: 通过web端上传文件到HDFS; 通过日志採集的方式导入到HDFS; 将数据库DB的表数据导入到HDFS. 正好近期都有在这方面 ...