CSS层叠样式表——DIV+CSS布局-创新互联

DIV+CSS布局

10多年的沐川网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。全网营销推广的优势是能够根据用户设备显示端的尺寸不同，自动调整沐川建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。创新互联公司从事“沐川网站设计”,“沐川网站推广”以来，每个客户项目都认真落实执行。

1  div和span

  DIV和SPAN在整个HTML标记中，没有任何意义，他们的存在就是为了应用CSS样式

  DIV和SPAN的区别在于，SPAN是内联元素，DIV是块级元素

2  盒模型

  margin  盒子外边距

  padding  盒子内边距

  border  盒子边框宽度

  width  盒子宽度

  height  盒子高度

3  布局相关的属性

3.1  position  定位方式

  正常定位  relative

  根据父元素进行定位  absolute

  根据浏览器窗口进行定位  fixed

  没有定位  static

  继承  inherit

3.2  定位

  离页面顶点的距离  left（左），right（右），top（上），bottom（下）

3.3  z-index  层覆盖先后顺序（优先级）

3.4  display  显示属性

  display:none  层不显示

  display:block  块状显示，在元素后面换行，显示下一个元素

  display:inline  内联显示，多个块可以显示在一行内

3.5  float  浮动属性

  left  左浮动

  right  右浮动

3.6  clear  清除浮动

  clear:both

3.7  overflow  溢出处理

  hidden  隐藏超出层大小的内容

  scroll  无论内容是否超出层大小都添加滚动条

  auto  超出时自动添加滚动条

4  兼容问题及高效开发工具

4.1  兼容性测试工具

  IE  Tester

  Multibrowser

4.2  常用的浏览器

 Firefox

  Google  chrome

  opera

4.3  高效的开发工具

4.3.1  轻级的

  Notepad++

  sbulime  Text

  记事本                  根据自己的需要来选择

4.3.2  重量级的

  WebStorm

  Dreamweaver

4.4  网页设计工具

  fireworks

  photoshop

5  判断IE的方法    条件注释只在IE浏览器

5.1  条件判断格式

  

5.2  不等于

 [if  !IE  8]    除了IE8都可以显示

5.3  小于

  [if  it  IE  5.5]    如果IE浏览器版本小于6的显示

5.4  大于

  [if  gt  IE  5]    如果IE浏览器版本大于5的显示

5.5  小于或等于

  [if  lte  IE  6]    如果IE浏览器版本小于6的显示

5.6  大于或等于

   [if  gte  IE  7]    如果IE浏览器版本小于7的显示

5.7  大于和小于之间

  [if  (gt  IE  5)&(it  IE  7)     如果IE浏览器版本大于IE5小于7的显示

5.8  或

  [if  (IE  6)|(IE  7)]    如果是IE6或者IE7显示

5.9  仅