理论知识

Posted 想学IT的小肉肉

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了理论知识相关的知识,希望对你有一定的参考价值。

想扩展深入了解,点击参考链接

1.DIV+CSS和table布局的区别:

  • DIV+CSS布局比table布局节省页面代码,代码也更加的清晰。
  • DIV+CSS的页面对搜索引擎支持好,而且速度更快了,能够比Table更加快速的显示网站内容。
  • DIV+CSS布局是网站版面布局修改更简单,因为表面代码都写在独立的css文件里,而table需要在页面中修改信息。

(参考http://www.codesky.net/article/201008/139693.html

2.px、rem与em的区别:(px:相对于显示器屏幕分辨率而言。em:相对于当前对象内文本的字体尺寸。rem:相对于HTML根元素。)

  • px的特点:
  1. IE无法调整那些使用px作为单位的字体大小。
  2. 国外的大部分网站能够调整的原因在于使用了em或rem作为字体单位。
  3. Firefox能够调整px、em和rem,但是96%以上的中国网民使用IE浏览器(或内核)
  • em的特点:
  1. em的值并不是固定的。
  2. em会继承父级的字体大小。
  • rem的特点(除IE8外,所有浏览器均支持):
  1. 只修改根元素就成比例的调整所有字体的大小。
  2. 可避免字体大小逐层复合的连锁反应。

(参考:http://www.cnblogs.com/leejersey/p/3662612.html

3.link和@import的区别:

  • link是Xhtml标签,除了加载CSS外,还可以定义RSS等其他业务;@import属于CSS范畴,只能加载CSS。
  • link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入后加载。
  • link是XHTML标签,无兼容问题;@import是CSS2.1提出的,低版本浏览器不支持。

(参考:http://www.cnblogs.com/zbo/archive/2010/11/17/1879590.html

4.页面重绘与页面回流:

  • 重绘:每个页面至少回流一次,就是在页面第一次加载的时候。也就是见受修改影响的部分重新“流一遍”,回流完成后,浏览器重新绘制受影响的部分到屏幕中,这种过程就叫做重绘。
  • 回流:当render tree(渲染树)中部分或全部因为元素的规模尺寸,布局,隐藏等改变需要重新构建时。

(参考:http://www.cnblogs.com/chuangweili/p/5160932.html

5.border:0和border:none的区别:

  • 性能区别:
      • {border:0;}设为0像素虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值。
      • {border:none;}设为none即没有,浏览器解析“none”时将不作出限额按动作,也不消耗内存值。
  • 兼容性区别:
      • {border:0;}设为0时,所有浏览器都一致把边框隐藏。
      • {border:none;}设为none时,IE6/7无效边框依然存在。

(参考:http://www.blueidea.com/tech/web/2009/7232.asp

6.绝对定位absolute与相对定位:relative的区别:

  • 绝对定位:对象脱离常规流,此时偏移属性参照的是离自身最近的定位祖先元素,如果没有定位的祖先元素,则一直回溯到body元素。盒子的偏移位置不影响常规流中的任何元素,其margin不与其他任何margin折叠。
  • 相对定位:对象遵循常规流,并且参照自身在常规流中的位置通过top,right,bottom,left这4个定位偏移属性进行偏移时不会影响常规流中的任何元素。 

(参考:http://www.cnblogs.com/z-w-r/p/6743846.html

7.img标签的title和alt属性的区别:

  • title:(标题、名目)
      • 对元素的注释说明和额外补充。(鼠标放到文字/图片上时有title文字显示。)
      • 并不作为搜索引擎抓取图片的参考,更倾向于用户体验。(如果图片旁边已有文字说明,就没必要再添加title。)
  • alt:(改变、替换)
      • 主要用于img标签,它规定的图像无法显示时的替代文本。
      • 当用户将鼠标一用到该img上时,IE会显示出alt属性的值(Chormel浏览器不会显示)
      • 有利于SEO,是搜索引擎搜录时判断图片与文字是否相关的重要依据。

(参考:http://playkid.blog.163.com/blog/static/562872602012108115949742/

8.块行元素的区别:

  • 块元素(转换为行元素方法:display: inline;):
      • 独占一行显示。
      • 可设置宽高。
      • margin、padding纵横都有效。
      • 除(p、h1-h6)个别特殊元素外,可包含块状元素和行元素。
      • from不能直接包含行元素。
  • 行元素(转换为块元素方法:display: block;):
      • 高度由内容撑开,可并排显示。
      • 不能设置宽高(内容设置宽高)。
      • margin、padding横向设置有效,纵向无。
      • 除ins和del外,不能包含块状元素。

(参考:http://blog.csdn.net/M_agician/article/details/72232873

9.display:none与visibility:hidden的区别:

  • display:none:会使整个对象彻底消失(所占空间改变),当设置为block时对象才会被加载进来。
  • visibility:hidden:只是对象隐藏,所占空间不改变。

(参考:http://bbs.blueidea.com/thread-2942695-1-1.html

10.HTML和XHTML的区别:

  • XHTML元素必须被正确的嵌套。
  • XHTML元素必须被关闭。
  • XHTML元素的标签名必须用小写字母。
  • XHTML文档必须拥有根元素。

(参考:http://www.w3school.com.cn/xhtml/xhtml_html.asp

11.文档声明中标准模式与兼容模式的区别:

  • 标准模式:在该模式下的排版和JS运作模式都是以该浏览器支持的最高标准运行。
  • 兼容模式:页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。

(参考:https://segmentfault.com/a/1190000000465431

12.em与strong,b与i的区别:

  • 默认样式:
      • strong=b=粗体;
      • em=i=斜体;
  • HTML4.01:
      • strong,em代表语义,从语义的强调,strong>em
      • b,i 无语义,只是样式加粗或斜体(不推荐使用)
  • HTML5:
      • strong:页面上的强调
      • em:句子中的强调
      • b:普通文本中重要性的文本,如:文档概要中的产品名。或者代表强调的排版方式
      • i:普通文章中突出不同意见或语气或其他的一段文本,如:分类名称,技术术语,一个外语谚语,一个想法等。或者代表斜体的排版方式

(参考:http://www.zhihu.com/question/19551271

 

以上是关于理论知识的主要内容,如果未能解决你的问题,请参考以下文章

网络技术理论:包片段帧数据报和段

网络技术理论:包片段帧数据报和段

理论知识

常见理论知识

2021年中国高校大数据挑战赛数据挖掘系统知识-附Matlab和Python实现代码

2021年中国高校大数据挑战赛数据挖掘系统知识-附Matlab和Python实现代码