ITPub博客

首页 > 应用开发 > Java > html中的DIV怎么运用?

html中的DIV怎么运用?

原创 Java 作者:赵x娿 时间:2014-12-15 19:48:28 0 删除 编辑

以前我们开发网站的时候,我们一般会采取表格和框架的方式来对网站做布局,比如说我们经常采用table来对网站前台一块一块的区域划分,而我们通常用iframe来对网页做上、左、右以及中央位置的布局。实际上采用这种方式是不满足网页前台美化和规范的。

从HTML 4.0的标准来看,实际上我们认为采用div+css的方式来美化网站前台是最好的,而表格table我们往往用来展示一些格式化的数据。

那么div标签是什么意思呢?如何用呢?其实在这里我们可以举一个例子,也就是我们可以把div标签看着是一个大盒子,而大盒子里面可以继续方小盒子。根据这个原理反过来也就是说小盒子是无法放大盒子的。所以我们在对网页前台美化的时候,我们会把这个div当作一个一个的盒子,然后按照大盒子装小盒子的规律,来把div有层次的嵌套起来,这样我们再通过CSS样式来布局这个DIV盒子,就能让我们的网站前台展示的有模有样。那下面我们来看一个简单的div案例帮助大家理解div标签,同时也教大家会用简单的div标签。




div大盒子装小盒子的案例




 

 

 
 

 



案例代码所运行的效果图:红色背景的是大盒子,左边黑色背景和右边的绿色背景的是小盒子,注意这里的两个小盒子把大盒子上半部分的红色背景给遮挡了,但实际上大盒子是已经装了以上两个小盒子的。本代码主要是演示div标签如何使用的案例。

来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/30050977/viewspace-1368746/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2014-12-04

  • 博文量
    114
  • 访问量
    83867