HTML中DIV与SPAN的区别

html的div和span, 经常会用到， 尤其是前者。

        1. div是块级元素， 实际上就是一个区域， 主要用于容纳其他标签。 默认的display属性是block

        2. span是行内元素， 主要用于容纳文字。 默认的display属性是inline

1.所谓块元素，是以另起一行开始渲染的元素，行内元素则不需另起一行，测试一下下面的代码你会有更形象的理解： 
测试＜span>紧跟前面的"测试"显示＜/span>＜div>这里会另起一行显示＜/div> 
2.块元素和行内元素也不是一成不变的，通过定义CSS的display属性值可以互相转化，如： 
测试＜div >紧跟前面的"测试"显示＜/div>＜span >这里会另起一行显示＜/span> 
提示：如果不对DIV元素定义任何CSS属性，其显示效果将行将于P元素。

因为DIV与SPAN元素的特殊性，所以一般用于应用样式表，比如说用CSS定义为层，而需要分清的是块元素和行内元素的区别，还有两者间的相互转化。 

DIV指定渲染 HTML 的容器。 
SPAN指定内嵌文本容器。 
总的来说，一个div是占一个块的，它的默认display属性是block，表示一个块。如： 
<div>aaa</div>bbb显示出来，是两行。 
而span，它的display默认属性是inline，可以连在一起的。如： <span>aaa</span>bbb，显示出来是一行。 
div一般用于排版，而span一般用于局部文字的样式。

html css 中ID与class的区别

1，在css样式表中书写时，id选择符前面应该加前缀符号‘#’，而class选择符前面应该加前缀符号‘.’。
2，id属性一般在一个页面中只可以使用一次，而class可以被多次引用。
3，id作为元素的标签，用于区分不同结构和内容，而class作为一个样式，它可以应用到任何结构和内容上。
4，在布局思路上，一般坚持这样的原则：id是先确定页面的结构和内容，然后再为它定义样式：而class相反，它先定义好一类样式，然后再页面中根据需要把类样式应用到不同的元素和内容上面。
5，目前浏览器都能允许在同一个页面内出现多个相同属性值的id，一般情况下也能正常显示，不过当使用javascript通过id来控制元素时就会出现错误。
6，在实际应用时，class更多的被应用到文字版块以及页面修饰等方面，而id更多地被用来实现宏伟布局和设计包含块，或包含框的样式。 

 1 补充：class和id在页面里面的使用方法： 
 2 class：
 3 <style type="text/css">
 4 .footer{background:red;}
 5 </style> <div class="footer">footer</div>
 6 id： <style type="text/css">
 7 #footer{background:red;}
 8 </style>
 9 <div id="footer">footer</div>
10 
11 定义class的css是用点：“.”，如.footer
12 定义id的css是用井号“#”，如#footer

 Relative和absolute定位这两个有什么区别?

用Div+CSS进行网站布局时，做一些浮动层等特殊特殊效果时要考虑到定位问题。这就要用到Position属性等。
Position属性有四个值：static、fixed、absolute和relative，

后面两个在布局中的定位里是经常用到的，顾名思义，

absolute是指绝对定位，即将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位，而其层叠通过z-index属性定义。此时对象不具有边距，但仍有补白和边框。

ralative是指相对定位，就是依据left，right，top，bottom等属性在正常文档流中偏移位置。

但是，怎么个绝对法，又怎么个相对法呢？

1、当Position属性值为Relative时对象原来占有的位置保留，其后面的对象按原来文档流仍然保持原来的位置Top的值表示对象相对原位置向下偏移的距离bottom的值表示对象相对原位置向上偏移的距离两者同时存在时，只有Top起作用。left的值表示对象相对原位置向右偏移的距离right的值表示对象相对原位置向左偏移的距离两者同时存在时，只有left起作用。

2、当Position属性值为absolute时对象从文档流中抽取出来，原占有的位置被后面的对象顶替上来Top的值表示对象上边框与浏览器窗口顶部的距离bottom的值表示对象下边框与浏览器窗口底部的距离两者同时存在时，只有Top起作用；如果两者都未指定，则其顶端将与原文档流位置一致，即垂直保持位置不变。left的值表示对象左边框与浏览器窗口左边的距离right的值表示对象右边框与浏览器窗口右边的距离两者同时存在时，只有left起作用；如果两者都未指定，则其左边将与原文档流位置一致，即水平保持位置不变。

在Position属性值为absolute的同时，如果有一级父对象（无论是父对象还是祖父对象，或者再高的辈分，一样）的Position属性值为Relative时，则上述的相对浏览器窗口定位将会变成相对父对象定位，这对精确定位是很有帮助的。

html各元素中的区别