div+css布局课程1.ppt

* Div+Css布局 主要内容： 1）Dw软件基础学习 2）html中常用标签学习 3）div+css布局学习 4）js的应用 5）浏览器兼容问题及解决方法 前台 后台 网站制作流程 制作效果图 (PS/FR) 数据库 (MySQL/SQLserver) 后台语言 （jsp/asp/.net/php） 前台布局 （dw/记事本） 网站/浏览器 网站策划 常用术语： 1）网页切图的注意事项 2）web标准：大部分有w3c（万维网联盟）制定 3）html、xhtml、xml 超文本标记语言 html是：Hypertext Marked Language，即超文本标记语言,是一种用来制作超文本文档的简单标记语言。用html编写的超文本文档称为html文档,使用html语言描述的文件，需要通过www浏览器显示出效果 xml是一种能定义其他语言的语言 xml虽然数据转换能力强大，完全可以替代html，但面对成千上万已有的站点，直接采用xml还为时过早。因此，我们在html4.0的基础上，用xml的规则对其进行扩展，得到了xhtml语言 4）Css：级联样式表或风格样式表；用来进行网页风格设计的 4）table+css布局、div+css布局 早期的网页布局方法，用表格。其优点是布局方便直观，缺点是网页显示速度慢。最主要是弊端是不利于结构和表现分离。 web标准推荐采用div+css布局，这样更容易将结构和表现分离，而建议表格用于显示数据，而不是布局整个网页。也有人指出，蜘蛛更喜欢div的简单的布局方式 Dr软件基础知识 1）html文件的创建 2）站点的建立 站点文件夹下，首页必须在根目录下，且必须命名为index.html 文件 3）常用面板介绍 4）设计模式、拆分模式、代码模式的介绍 5）设计模式下dw软件的简单应用 Css引用 三种形式： 1）行内样式 :p style=font-size:18px;内部样式/p 这种在标签内以style标记的为行内样式，行内样式只针对标签内的元素有效，因其没有和内容相分离，所以不建议使用。 2）内部样式 : style .h2 { color:#f00;} /style 这种形式是内部样式表，它是以style和/style结尾，写在源代码的head标签内。这样的样式表只能针对本页有效。不能作用于其它页面。 3）外部样式 :link href=layout.css rel=stylesheet type=text/css / 这种形式是把css单独写到一个css文件内，然后在源代码中以link方式链接。它的好处是不但本页可以调用，其它页面也可以调用，是最常用的一种形式。 另：有导入样式 导入样式 :@import url(/css/global.css); 链接样式是以@import url标记所链接的外部样式表，它一般常用在另一个样式表内部。如layout.css为主页所用样式，那么我们可以把全局都需要用的公共样式放到一个global.css的文件中，然后在layout.css中以@import url(“/css/global.css”)的形式链接全局样式，这样就使代码达到很好的重用性。 更多精彩欢迎访问： *