在div中添加div，div添加css教程

div+css布局过程

新建一个html文件，命名为test.html，用于讲解div+css布局的基本流程。在test.html文件内，对body进行样式初始化，设置外边距margin为0，内边距padding为0，同时使用text-align设置文字居中。

最一般的布局方式是头部、主体部分、尾部，类似于word文档的页眉、文档主体内容、页脚的分布。

使用CSS和div布局，你可以先把整个网页划分成几块，然后在html里每一块用一个div框起来，然后对相应的div定义CSS，将其放置到网页中相应的位置，完成整体布局。

/div /body 接着在这个框架下开始写入信息，如logo以及导航信息，以及内容，以及页脚 编写好后，再编写css样式，创建一个style.css的样式，在这个样式表里面写入网页标签的颜色，大小，背景。。

DIV+CSS三行两列经典布局 这个XHTML1标准的DIV+CSS布局是著名网页设计师2004年发布在《网页设计师》上的，一个非常经典的布局，在IE、Mozilla和Opera浏览器中均可以实现居中和高度自适应。

先用DIV来把导航的位置定下来！ 然后用CSS设置DIV中导航连接的属性，比如颜色下划线等等。 具体怎么做要看你怎么设计了。

div+css如何布局头部导航条!

一般导航条采用ul li列表布局，这里也不例外，也采用列表标签ul li + CSS布局。

要实现上图所示的布局效果，有两种布局方法：语义布局和视觉布局使用CSS3制作导航条和毛玻璃效果 导航条对于每一个Web前端攻城狮来说并不陌生，但是毛玻璃可能会相对陌生一些。

在电脑上打开软件，新建一个html文件，在head部分，编写css样式， list-style-type： none；是除掉导航前面默认带的点，li a，li a.active ，li a：hover：not(.active) 设置鼠标滑到导航栏的颜色变化。

先用DIV来把导航的位置定下来！ 然后用CSS设置DIV中导航连接的属性，比如颜色下划线等等。 具体怎么做要看你怎么设计了。

最一般的布局方式是头部、主体部分、尾部，类似于word文档的页眉、文档主体内容、页脚的分布。

css+div做图片中的导航条的方法：思路：对ul里的li设置排成一排所以需要设置一个CSS display：inline让li排成一排，从而让li并排布局。

CSS+DIV网页制作的一般思路和过程是什么样的呢

1、新建一个html文件，命名为test.html，用于讲解div+css布局的基本流程。在test.html文件内，对body进行样式初始化，设置外边距margin为0，内边距padding为0，同时使用text-align设置文字居中。

2、而且我们可以通过css来对导航栏的样式方便的作出调整。用div设置导航栏一般就用 和 标签。高度显示效果不同一般情况下只需要使用height： 100px；即可，当显示效果不同时，则可以_height： 100px；来对IE6的高度进行设置。

3、网页设计师（主要是用PS）先将网页设计出来。进行网页制作，就是切片，div+css布局，将图片变成网页。后台制作。可以自己开发，也可以套用cms，如dedecms，phpcms。等 具体步骤就是这样。

4、/div /body 接着在这个框架下开始写入信息，如logo以及导航信息，以及内容，以及页脚 编写好后，再编写css样式，创建一个style.css的样式，在这个样式表里面写入网页标签的颜色，大小，背景。。

怎样定义一个DIV里的元素的CSS样式

1、div id=cc class=blue蓝色/div ---样式定义这样写：.red{color：#f00；} .blue{color：#00f；} 这里样式名称前面的符号是.，则通过div里面的class属性来匹配样式不过，在HTML如果是这样。

2、div id=myDiv p这是我的div中的文本内容/p/div使用CSS： 为添加的内容设置样式. 通过选择器，找到需要设置样式的元素，然后给它设置样式。例如，可以使用id选择器来设置文本的颜色。

3、新建一个html文件，创建一个类名为wrap的div。先通过css类选择器选择到div来控制div的宽度和高度和背景颜色（没有边框时方便看出来div的大小）。

4、嵌入式：使用HTML的style元素，在文档中定义CSS样式 head style type=text/css h1{color：red} p{color：blue} /style head 内联式 ：每一个HTML元素都包含一个style属性，可以直接定义样式。

5、引jQuery，然后定义元素的style样式，根据自己的元素来定义，这里随性定义div的style样式。接着我们看样式所带来的效果，接着开始设置点击按钮会产生变化颜色等交互效果。

DIV+CSS建设网页简单的6个步骤

构思好网站的整体布局结构，一般我们按以下步骤来建设一个网站的页面：顶部部分，其中包括了LOGO、MENU和一幅Banner图片；页面中间部分，那就是我们的主体了，这里就以我们为一客户做的站点为例来说明。

选择“div标签”命令 打开dreamweaver，新建网页并保存为“die.html”，选择【插入】【布局对象】【div标签】命令，打开“div标签”对话框。

风格这一块是比较重要的，一个网站做出来，一定要有合理的结构布局，一方面提高用户体验，一方面方便搜索引擎蜘蛛爬行，我们要求的是代码精简，提高网页加载速度，尽可能的采用div+css结构，js类尽可能的放到网页底部。

总结：DIV+CSS相比TABLE有根多的优势，网页设计师应该及早摒弃TABLE方式，这样更有利于督促自己深入学习DIV+CSS知识。学习并使用DIV+CSS的网页设计方式并不难，只要了解一些基础知识，然后多做几个案例就能逐渐理解掌握。