在网页设计中,我们都会用到DIV+CSS设计网页,那么什么是DIV,什么又是CSS呢?

1.DIV

DIV,比较专业的解释是“层叠样式表单元的位置和层次划分”,通俗地讲,就是“块”的意思,我们可以把一个网页理解为由N个块组成的,用标签“

... ”表示一个块,其中第一个“ ”表示这个块的开始标签,最后的 表示结束标签,中间的“...”为内容(根据实际情况,这个内容可以是纯文字,也可以是HTML标签,DIV本身也是HTML标签,所以同样还可以包括N个DIV的“块”)。

DIV标签一般用"id"和"class"来区分各个“块”的不同样式,往往要配合CSS使用,"id"和"class"的值,可以随意取名,可以是字母和字母与数字组合,一般这样写:

... 和 ...

以上内容应放置在网页的“

”标签内,如下图:

2.CSS

CSS是“层叠式样式表”的意思,上面我们说到,DIV和CSS是搭配使用的,我们可以把div部分看着是一幅没有添加任何色彩的画,只是勾勒出了线条,而CSS的目的就是为这幅画添加各种不同的颜色。CSS样式表可以嵌入到网页中,也可以写一个单独的文件,后缀一般为“.css”。如果要调用单独的CSS文件,那么需要在网页中加入“”,表示调用的是网站根目录下css文件夹下的“1.css”,以下是嵌入到网页中的CSS示例图:

CSS中有很多的元素,这些元素可以让网页变得更加生动、丰富多彩。通过上述简单的DIV标签和CSS样式,我们可以得到如下效果:

上面的CSS中,我们定义了这两个块“a1”和“a2”的宽度和高度、背景颜色、字体,并使用了浮动,让它们排列在一排。

综合上述,我们仅是用简单的CSS举例说明它的作用,“.a1”表示任何class都可以调用“a1”这个元素的样式,而“#a2”只能定义id为“a2”这个元素的样式,且是唯一的。大家可以理解为“id”是总的样式,“class”既可以是总样式,也可以作为细节的样式使用,id和class也可以同时放在一个DIV块中,如“

... ”,但如果用这样写,上面的图的背景都是蓝色了。

这里暂不过多讨论DIV和CSS的写法和技巧,以后我们会告诉大家怎样通过它们制作出漂亮的网页,请大家密切关注本栏目内容,感谢大家的支持。

以上内容为本站原创,转载请注明出处:无忧云网(www.826pc)

更多推荐

html中div是什么效果,网页设计中的DIV是什么意思,CSS是什么意思?