您好,欢迎访问代理记账网站
  • 价格透明
  • 信息保密
  • 进度掌控
  • 售后无忧

前端笔记整理(HTML)

前端基础知识

  • DOCTYPE
    • DOCTYPE 声明
    • hack
    • 支持HTML5新标签
    • 严格模式与混杂模式区别
  • 标签属性
  • 对语义化的理解?
  • `iframe`的优缺点?

DOCTYPE

DOCTYPE 声明

<!DOCTYPE>声明有助于浏览器中正确显示网页。网页上不同的文件通过正确声明的HTML的版本,使浏览器就能正确显示网页内容。

特点:

  • 声明不区分大小写,无结束标签
  • HTML 4.01 中,<!DOCTYPE>声明需引用 DTD(文档类型声明),因为 HTML 4.01 是基于 SGML (Standard Generalized Markup Language 标准通用标记语言)DTD 指定了标记语言的规则,确保了浏览器能够正确的渲染内容。而HTML5 不是基于 SGML,因此不要求引用 DTD
  • HTML 4.01 规定的三种<!DOCTYPE> 声明:StrictTransitionalFrameset

hack

<!—[if IE 6 ]><html class="ie ielt9 ielt8 ielt7 ie6" lang="en-US"><![endif]—>
<!—[if IE 7 ]><html class="ie ielt9 ielt8 ie7" lang="en-US"><![endif]—>
<!—[if IE 8 ]><html class="ie ielt9 ie8" lang="en-US"><![endif]—>
<!—[if IE 9 ]><html class="ie ie9" lang="en-US"><![endif]—>
<!—[if (gt IE 9)|!(IE)]><!—><html lang="en-US"><!—<![endif]—>

支持HTML5新标签

  • IE8/IE7/IE6支持通过document.createElement方法产生的标签,可利用该特性让这些浏览器支持HTML5新标签;
   <!--[if lt IE 9]> 
   <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script> 
   <![endif]--> 

严格模式与混杂模式区别

  • 严格模式的排版和 JS 运作模式: 以该浏览器支持的最高标准运行。
  • 在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
  • DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现

标签属性

特点:

  • 属性和属性值对大小写不敏感
  • <p></p>:浏览器会自动地在段落的前后添加空行。( 是块级元素)
  • <pre></pre>:预格式化文本,可用于对空行和空格进行控制;

对语义化的理解?

  • 去掉或者丢失样式的时候能够让页面呈现出清晰的结构
  • 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息:爬虫依赖于标签来确定上下文和各个关键字的权重;
  • 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以意义的方式来渲染网页;
  • 便于团队开发和维护,语义化更具可读性,遵循W3C标准的团队都遵循这个标准,可以减少差异化。

iframe的优缺点?

  • <iframe>优点:

    • 解决加载缓慢的第三方内容如图标和广告等的加载问题
    • Security sandbox
    • 并行加载脚本
  • <iframe>的缺点:

    • iframe会阻塞主页面的Onload事件;
    • 即使内容为空,加载也需要时间
    • 没有语意

分享:

低价透明

统一报价,无隐形消费

金牌服务

一对一专属顾问7*24小时金牌服务

信息保密

个人信息安全有保障

售后无忧

服务出问题客服经理全程跟进