HTML学习知识总结

47 阅读2分钟

这里简单记录一下html的学习知识

1.html5新增内容

新增的语义化标签: nav,header,footer, article,section等

新增的媒体标签: audio, video  

表单的一些属性

dom查询操作:document.querySelector() ,document.querySelectorAll

数据存储格式: localStorage, sessionStorage

ps:这里讲述一下storage,session等的区别

storage分为localStorage和sessionStorage,localStorage存储时间为永久,sessionStorage存储时间为会话期间,当网页关闭后,存储内容清空。

cookie表示一些身份信息,存储一些用户身份信息,当发送请求时,会携带cookie信息。因为请求会携带,所以对于请求会有一些额外的开销。

  • 会话期 Cookie 会在当前的会话结束之后删除。浏览器定义了“当前会话”结束的时间,一些浏览器重启时会使用会话恢复。这可能导致会话 cookie 无限延长。
  • 持久性 Cookie 在过期时间(Expires)指定的日期或有效期(Max-Age)指定的一段时间后被删除。

 主要区别的话: 存储时间不同, 存储大小不同(cookie),数据有效期不同

 

2.行内元素与块级元素

 对于行内元素和块级元素的认知还是很有必要的,在布局时要注意,不要让行内元素包裹块级元素。

行内元素:span,a, b, img

块级元素:div, h1, p, ul,li,...

行内元素与块级元素的区别

块级元素自己占一行,默认情况下继承父元素的宽度。行内元素则不会独占一行,多个行内元素会排列在同一行中。

块级元素可以设置宽高,而行内元素无法设置宽高。可将行内元素设置为行内块元素来进行设置宽高。

 

3.iframe的优点与缺点

iframe是创建一个包含另一个文档的内联框架。

优点: 

用来加载速度较慢的内容

可以同时加载不同的资源,提升页面加载速率

老旧浏览器的兼容性好

缺点:

脱离文档布局,不利于seo搜索引擎

会产生很多页面,不利于管理

需要额外的代码来处理iframe的一些容错问题

 

因为关于html方面知识确实比较少,这里先简单记录一下,等后续的一些补充...