CSS层叠样式表3

时间:2022-06-03 13:19:03

一   DIV+CSS布局

1.1   div和span

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

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

1.2   盒模型

   margin   盒子外边距

   padding   盒子内边距

   border   盒子边框宽度

   width   盒子宽度

   height   盒子高度

1.3   布局相关的属性

1.3.1   position   定位方式

   正常定位   relative

   根据父元素进行定位   absolute

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

   没有定位   static

   继承   inherit

1.3.2   定位

   离页面顶点的距离   left(左),right(右),top(上),bottom(下)

1.3.3   z-index   层覆盖先后顺序(优先级)

1.3.4   display   显示属性

   display:none   层不显示

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

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

1.3.5   float   浮动属性

   left   左浮动

   right   右浮动

1.3.6   clear   清除浮动

   clear:both

1.3.7   overflow   溢出处理

   hidden   隐藏超出层大小的内容

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

   auto   超出时自动添加滚动条

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

1.4.1   兼容性测试工具

   IE  Tester

   Multibrowser

1.4.2   常用的浏览器

  Firefox

   Google  chrome

   opera

1.4.3   高效的开发工具

                             

1.4.3.1   轻级的

   Notepad++

   sbulime  Text

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

1.4.3.2   重量级的

   WebStorm

   Dreamweaver

                              

1.4.4   网页设计工具

   fireworks

   photoshop

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

1.5.1   条件判断格式

   <!--[if  条件  版本]>  那么显示  <![endif]-->

1.5.2   不等于

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

1.5.3   小于

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

1.5.4   大于

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

1.5.5   小于或等于

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

1.5.6   大于或等于

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

1.5.7   大于和小于之间

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

1.5.8   或

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

1.5.9   仅

   <!--[if  IE  8]>      如果是IE8,就只显示IE8


1.6   《DIV+CSS网页布局实战》

   先分析,再切图,然后搭建框架,慢慢的循序渐进,下一步解决兼容,最后完成