CSS设计彻底研究专题培训课件.ppt

CSS设计彻底研究

第0课《CSS设计彻底研究》简介CSS——崭新的“老技术”CSS带来的好处：CSS使页面载入更快；CSS可以降低网站的流量费用；CSS使设计师在修改设计时更有效率，而代价更低；CSS使整个站点保持视觉的一致性；CSS使站点可以更好地被搜索引擎找到；CSS使站点对浏览者和浏览器更具亲和力；在世界上越来越多人采用Web标准时，掌握CSS可以提高设计师的职场竞争实力。

第0课《CSS设计彻底研究》简介面向读者本书面向的读者，需要两点基本要求：?1：具有一定网页制作基础的读者，希望读者已经对HTML的基本元素有所了解。2：具有钻研的精神和热情。? 其中第一点权重占10%，第2点权重占90%。

源码网：

第0课《CSS设计彻底研究》简介“授人以鱼” 与“授人以渔”

第0课《CSS设计彻底研究》简介第1章：介绍(X)HTML和CSS相关的核心基础知识。第2章：向读者展示CSS能够给网页设计带来的效果。第3章：深入讲解CSS的核心机制——盒子模型。第4章：讲解CSS布局的重点和难点——浮动和定位。第5章：介绍文字和图像的排版。第6章：介绍了链接和导航相关的设置方法。第7章：制作比较简单的竖直排列的导航菜单。第8章：制作复杂一些的水平排列的导航菜单。第9章：制作两级的下拉菜单。

第0课《CSS设计彻底研究》简介第10章：介绍了对表格的样式的设置方法，通过制作复杂的多模式日历。第11章：深入讲解了制作圆角框的多种方法，深入分析了不同方法的特点和使用范围。第12章：介绍了在近年出现的一些新的网页元素的制作方法，例如Tab面板、折叠面板、伸缩面板等等。第13和14章：全面地归纳和总结了不同形式布局的设计方法，并给出全面的案例。第15至17章：以CSS禅意花园的作品为例，在研究成功作品的基础上，制作了自己的CSS禅意花园作品，从而演示了对整体页面的布局方法。

第0课《CSS设计彻底研究》简介学习资料《CSS设计彻底研究》即将出版《精通CSS+DIV网页样式与布局》

第1章(X)HTML与CSS核心基础HTML与CSS的关系HTML与XHTMLDOCTYPE（文档类型）的含义与选择

!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtdhtmlxmlns=/1999/xhtmlhead…………

第1章(X)HTML与CSS核心基础XHTML与HTML的重要区别1.在XHTML中标记名称必须小写2.在XHTML中属性名称必须小写3.在XHTML中标记必须严格严格嵌套4.在XHTML中标记必须封闭5.在XHTML中，即使是空元素的标记也必须封闭6.在XHTML中属性值用双引号括起来7.在XHTML中属性值必须使用完整形式8.在XHTML中，应该区分“内容标记”与“结构标记”

第1章(X)HTML与CSS核心基础在HTML中引入CSS的方法行内式h1style=color:white;background-color:blueThisisalineofText./h1内嵌式styletype=text/css h1{ color:white; background-color:blue }/style

第1章(X)HTML与CSS核心基础在HTML中引入CSS的方法导入式styletype=text/css @importmystyle.css;/style链接式 linkhref=mystyle.cssrel=stylesheet type=text/css/

第1章(X)HTML与CSS核心基础基本CSS选择器含义和作用标记选择器类别选择器ID选择器h1color:red;font-size:25px;{}选择器属性值属性值声明声明

第1章(X)HTML与CSS核心基础复合选择器“交集”选择器 div.special{……} div#special{……}“并集”选择器 div,h1.first,p.specia{……}后代选择器 divh1.firstspan.firstLetter{……}

第1章(X)HTML与CSS核心基础CSS的继承特性(13~15.htm)

第1章(X)HTML与CSS核心基础CSS的层叠特性(16.htm)行内样式ID样式类别样式标记样式p这是第1行文本/ppclass=red这是第2行文本/ppid=line3class=red这是第3行