1、1打开编辑器，新建testhtml，用于学习今天的内容2接下来需要在head标签下方引入插件3在页面的body标签里，新建一个p，名称为test4在body标签下方写上scriptscript，用来存放js代码通过class定位到p，通过css方法让文字居中5在浏览器中打开testhtml，可以在文字。

2、1#divid p选取的是id为divid下的所有p元素#divid的子元素，可以有多个p元素ltdiv id=quotdividquot ltp我被选取ltp ltp我也被选取ltp ltp我也被选取ltp ltdiv 2p#divid选取的是id为divid的p元素，只有一个元素ltp id=quotdividquot我是p元素，我的id是divid。

3、第一种办法换DIV的名字再调入外部CSS第二种方法用类样式表覆盖ID样式ltdiv id=quots_navquot class=quotdrop_menuquot div第三种方法不调入外部CSS把CSS直接复制到网页里，修改该页的样式这种我建议你用~。

4、在css里先写入内容的属性，比如 menu width500px margin0px auto然后在html内调用， ltdiv class=quotmenuquot内容ltdiv。

5、1实现定义好的样式类，然后div直接ltdiv class=quottestquotltdiv test 2直接写样式代码 ltdiv style=quotxxxxquotltdiv 3直接指定id ltdiv id=quottestquotltdiv test 4直接指定标签，这种写法，将对所有div标签有效 ltdivltdiv div。

6、在页面的head标签中插入代码ltstyle type=quottextcssquotltstyle 在style标签中添加样式就可以了 然后你可以在页面外部修改css样式表，用这方法控制div的大小位置填充边距背景字体之类的属性但是这种方法不是很好，因为修改的时候麻烦，而且网上浏览下载的时候较慢如果还有什么不明白的地方。

7、ltstyle type=quottextcssquot margin 0padding 0 bodywidth1012px div width 300pxheight 300pxborder 2px solid #333bordersizingborderbox*将边框设置为内边框 这样就不影响元素的宽度和高度，这样正好右列二到页面左边距正好是700px ，没有这个属性的话是708px* f。

8、第一步先建立indexhtml和csscss两个文件放在同一目录里 建议编辑工具用Dreamweaver以后简称DW第二步在indexhtml里的ltheadlthead之间放入 ltlink href=quotcsscssquot rel=quotstylesheetquot type=quottextcssquot 这段代码是外部CSS调用，注意href=quotcsscssquot这是路径 因为indexhtml和css。

9、1我们创建一个HTML页面，在body标签中添加一个div标签组2然后在上面的head标签中title标签下，输入引用CSS的代码style标签3然后在标签中输入一个CSS名称以及相关的样式要注意看下图的格式，别少输入了4最后在下方的div标签中，引入cass，并输入对应的样式名称这样就成功引入了CSS。

10、rel 连接的文件与html文档之间的关系 type 文件类型 href 指向链接的css文件 这是最常用的引入方式，这种方法可以将css写入一个文档直接放在一个文件夹中，即将html与css分离开来2在html文档的head部分直接写入css文档 p fontsize20pxcolorblue 3在标签中直接加入 ltdiv style=quotborder2。

11、ltstyle ltdiv ltbody lthtml stylecss* This is an external style sheet * h1 color green p fontsize 18pxtextalign right 这段代码中，第一个div使用内联CSS来样式其内容，第二个div使用外部CSS文件来样式其内容，第三个div使用嵌入式样式表来样式其内容。

12、接下来将逐个讲解html引用css方法的例子 1直接在html标签元素内嵌入css样式，如ltdiv style=quotfontsize14px color#FF0000quot我是div css测试内容支持ltdiv 效果如下图 2在html头部head部分内style声明插入代码如下ltstyle type=quottextcssquot lt！ ceshi fontsize14px color#。

13、lth1lta href=quot#quot这是试验调用文字ltalth1 直接h1标签调用，不必使用DIV这段代码定义的是h1标签中的链接点击后的颜色。

14、下面我们进行布局一般网页都是3层一级，所以我们需要div布局了在body里面写一般我会先分为3层 lthtml lthead lttitlelttitle ltlink href=quotmaincssquot type=quottextcssquot rel=quotstylesheetquot lthead ltbody ltdiv id=quottopquot ltdiv id=quottop1quotltdiv ltdiv id=quottop2quotltdiv ltdiv。

15、首先，建议你一点，与其在上一个div里面用marginbottom不如在下一个div里面用margintop，因为marginbottom经常会失效，而你这样的布局可以这样写 ltstyle margin0pxpadding0px bodymargin0px auto bluemargin0px autobackground#34d5f2padding150px 50pxmargintop100px。

16、DIV+CSS我们可以分为DIV和CSS两个概念CSS全称为Cascading Style Sheets，中文翻译为“层叠样式表”，简称CSS样式表，所以称之为层叠样式表Cascading Stylesheet简称CSS在网页制作时采用CSS技术，可以有效地对页面的布局字体颜色背景和其它效果实现更加精确的控制只要对相应的代码做一些简单的。