《DIV布局.docVIP

DIV与TABLE布局不同 什么是DIV DIV是标签对，表示一个层，里面包含HTML代码，也可以被HTML标记包围。 DIV与TABLE的区别 DIV层可以用来布局，使所表现的网页更清楚、细腻，而且HTML代码少，所以越来越多的网页制作者采用DIV布局取代TABLE布局。 如何用DIV布局 设置好DIV选择符 在CSS样式中，以“#”开头的选择符为ID选择符，与DIV中的ID设置关联，同理，以“.”开头的为类选择符，与DIV中的参数class设置关联。 设置CSS修饰DIV效果 用样式表修饰内容，样式表就是用CSS来控制HTML标记，使标记达到预定的效果。 设置DIV的背景颜色 使用DIV注意事项 （1）使用DIV时要确定好层对象的宽度。好多初学者想把层控制到一个方面，但层默认的是100%，在不确定宽度情况下不能移动。 （2）当确定宽度后，使用属性float进行漂移，如在一个位置要想两个层并排，可以设置两层向一个方向漂移（如设置float为left），还有一种方法设置一个向左一个向右，但是中间有间隔，合理地调节这个间隔就可以了。 （3）当用float设置过后的层，在接下来用到的层受空间漂移后的影响，也会出现漂移情况，但这时的漂移并不是当初想要的，所以还需要用到属性clear来设置对象不往某方向漂移，当然，clear主要针对float属性应用。 （4）在设置高度时，如果对层对象设置了高度，而显示内容超过其区域，在IE中可以自动延长对象的区域，但在FF中，会出现固定的区域（设置边框可以看到层对象的边框），其他的内容超过对象还会显示，解决这个问题可以去掉高度属性的（height）设置。 （5）在层内部要设置绝对定位时，需要在父对象中先设置相对定位，否则绝对定位是以body/body父对象进行定位。 解读SPAN什么是SPAN 与DIV标签块级元素不同，SPAN标签指行内元素，主要用于文本的容器，相对于DIV容器，SPAN容器相对于文本或图片要小些。DIV和SPAN元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染，主要用于应用样式表。 与DIV一样，SPAN也是一个标记，包含着一个容器，里面所放置的可以是文本或图片等，SPAN的宽度依照包围着对象的宽度而定，故不能用宽度属性width设置SPAN标记内对象的宽度，但可以设置SPAN的margin（外补丁）值，设置SPAN中的对象位置与父对象的距离。 何时用SPAN标签一个DIV内容不超过一行，所占的就是一行文本内容，因为DIV默认宽度是父对象的100%，而SPAN标记中的内容宽度是指其内容所占的宽度，即不能设置SPAN的宽度，所以在一行文本中，想对其中的文字设置样式，而又不要该行文本换行的条件下，可以选择SPAN标记，同理，在图片中应用也如此。 DIV与SPAN区别 默认宽度不同 。 SPAN和 DIV的区别在于，DIV是一个块级元素，可以包含段落、标题、表格，乃至诸如章节、摘要和备注等；而SPAN 是行内元素，SPAN 的前后是不会换行的，它没有结构的意义，纯粹是应用样式，当其他行内元素都不合适时，可以使用SPAN。 块元素与行内元素 DIV与SPAN的区别，即设置块元素与行内元素时，用display属性可以对其转化。 用CSS控制DIV语法 div style=#/div div style=”width:760px;height:200px;”这表示一个层/div CSS文件链接CSS文本的链接方式有3种，分别为内联定义、链入内部CSS和链接外部CSS. 内联定义 内联定义即是在对象的标记内，使用对象的style属性定义适用其的样式表属性。 链入内部CSS style type=”text/css” /*这里写CSS内容*/ /style 链接外部CSS link type=”text/css” rel=”stylesheet” src=’style.css” CSS编写环境CSS是Cascading Style Sheet 的缩写，翻译成中文是层叠样式表单，有时简称样式表。它是控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。CSS通常在网页制作中起重要角色，而且还可以减少网页代码量，更能提高网络访问网页的速度，而且更容易学习和实践，所以CSS越来越被更多的网页工作者采用。 CSS文件链接方式内联定义 内联定义即是在对象的标记内，使用对象的style属性定义适用其的样式表属性。 链入内部CSS style type=”text/css” /*这里写CSS内容*/ /style 链接外部CSS link type=