首页
学习
活动
专区
工具
TVP
发布
您找到你想要的搜索结果了吗?
是的
没有找到

谈谈 html 语义化的理解

语义是指一个词或者句子含义的正确解释。很多 HTML 标签也具有语义的意义,也就是说元素本身传达了关于标签所包含内容类型的一些信息。...HTML5 常用的语义元素 HTML5 提供了新的语义元素来定义网页的不同部分,它们被称为“切片元素”,如图所示 : header:用于定义页面的头部区域,通常包括网站 logo、主导航、全站链接以及搜索框...大约有 100 多个 HTML 语义元素可供选择,以下是常用的语义元素: 更多的语义化标签可以参阅:*https://developer.mozilla.org/en-US/docs/Web/HTML...HTML5 在无障碍方面进行了加强,加入了无障碍属性。 所谓 HTML5 无障碍属性,主要针对的是视觉缺陷,失聪,行动不便的残疾人以及假装残疾的测试人员。...HTML5 中新增加的很多标签,例如:article、nav、header 和 footer 等,就是基于语义化设计原则

1.1K10

html写法gzip压缩率的影响

前几天在群里看到小杜分享一篇文章,《html写法gzip压缩率的影响》,为此我也这点分析了一下。 不知道大家有没有看过这文章,作者是来自微博懒懒交流会,其内容我这里先简述一下。...所以我们可以用位置长度这样一信息,来替换后一块内容。...举例 ...可见,行与行之间的连续性压缩率也可能会产生影响。 换句话来说,代码相似率越大,压缩率就越高。 不管是从压缩率方面还是从代码整齐美观方面来讲,我们应该把代码按顺序写,方便了团队,也方便了压缩。...他的Size和Content纠结了很久。不明白他们分别表示什么意思。有时size比content值大,有时size比content值小。 经过CJ的指点和自己的实验,得以下结果。

1K20

html写法gzip压缩率的影响

前几天在群里看到小杜分享一篇文章,《html写法gzip压缩率的影响》,为此我也这点分析了一下。 不知道大家有没有看过这文章,作者是来自微博懒懒交流会,其内容我这里先简述一下。...所以我们可以用位置长度这样一信息,来替换后一块内容。...举例 ...可见,行与行之间的连续性压缩率也可能会产生影响。 换句话来说,代码相似率越大,压缩率就越高。 不管是从压缩率方面还是从代码整齐美观方面来讲,我们应该把代码按顺序写,方便了团队,也方便了压缩。...他的Size和Content纠结了很久。不明白他们分别表示什么意思。有时size比content值大,有时size比content值小。 经过CJ的指点和自己的实验,得以下结果。

756100

理论 | HTML写法gzip压缩率的影响

作者|zzbozheng 原文|http://imweb.io/topic/586b2206b3ce6d8e3f9f99ce 前几天在群里看到小杜分享一篇文章,《html写法gzip压缩率的影响》,为此我也这点分析了一下...所以我们可以用位置长度这样一信息,来替换后一块内容。 举例 通过gzip压缩后,在chrome的开发者工具看到的size是563B。...先把CSS文件中的属性都按顺序写: gzip看到的size是463B 属性打乱顺序后: gzip后的size是464B 由此得出结论,那么不仅是html, 连CSS也有类似效果。...可见,行与行之间的连续性压缩率也可能会产生影响。 换句话来说,代码相似率越大,压缩率就越高。 不管是从压缩率方面还是从代码整齐美观方面来讲,我们应该把代码按顺序写,方便了团队,也方便了压缩。...他的Size和Content纠结了很久。不明白他们分别表示什么意思。有时size比content值大,有时size比content值小。

55210

html与body的一些研究与理解

一、写在前面的 最近一直构思着写篇关于标签的文章,虽说之前处理过标签,也解决过不少棘手的问题,但是其理解还不是很透彻,很多原理都是自己推测的。...而这里,我要讲述的与上面的交集并不多,只要是讲述一些关于与的各种表现,以及我自己这些表现的合理的解释和并提供一些过去处理类似问题的经验,希望大家能够有所帮助。...css代码: body{background:#069; margin:100px; border:30px solid #093;} 意思很简明:外边距100像素,边框30像素,背景色#069,按照一般标签的理解...IE6浏览器下htmlmargin不敏感不支持 Firefox浏览器下: ?...前段时间看到百度的一道面试题,说什么透明层无论滚动与否都满屏显示,其实就是和标签做一番手脚,两者高度100%显示,同时溢出隐藏(overflow:hidden),然后用一个<div

2K30

浅谈JavaScript如何操作html DOMJavaScript 能够改变页面中的所有 HTML 元素改变 HTML 样式** JavaScript 有能力 HTML 事件做出反应**添加和删除

** 通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素。** HTML DOM 树 ? Paste_Image.png DOM树很重要,特别是其中各节点之间的关系。...JavaScript 能够改变页面中的所有 HTML 元素 JavaScript 能够改变页面中的所有 HTML 属性 JavaScript 能够改变页面中的所有 CSS 样式 JavaScript 能够页面中的所有事件做出反应... 改变 HTML 样式 HTML DOM 允许 JavaScript 改变 HTML 元素的样式。...('a').style.color='blue'">change color ** JavaScript 有能力 HTML 事件做出反应** HTML...如何 HTML DOM 事件作出反应 如何添加或删除 HTML 元素

5.7K10

python 使用jinja2html模板文件进行数据替换

背景:执行完自动化测试后,希望将获取到的测试结果数据替换html模板文件,以生成测试报告。 image.png 解决方案:使用python语言的jinja2组件,可以对模板文件进行各种数据处理。...参考链接: http://docs.jinkan.org/docs/jinja2/intro.html https://www.jianshu.com/p/3bd05fc58776 处理过程: 1-编写...html模板文件,包含需要替换的变量及相关模板控制语句 2-将需要动态替换的数据,以json的形式存储在变量中 3-使用jinja2组件相关功能,读取模板文件并设置变量对应的value ---- 相关代码...文件,并将测试结果数据替换模板文件生成新的文件report.html。...生成的report.html文件如下所示。 image.png

5.1K1512
领券