初相识——HTML5 盒模型

本文介绍了HTML5的盒模型概念,包括盒模型的基本组成:宽度、高度、内边距、边框和外边距。详细讲解了内边距的注意事项,如顺时针赋值方式。同时探讨了边框的属性,如border-radius和透明边框设置。还讨论了外边距的叠压现象和塌陷问题,提出了解决塌陷问题的几种方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

目录

1.关于什么是盒模型

2.每个盒模型的基本组成:

3.内边距的注意事项:

 4.边框(border)的主要实现属性:

               (1)一些线的实现                                               

5.外边距(margin)的主要实现属性:

              (1).叠压现象

              (2).塌陷问题                                       


1.关于什么是盒模型

每个标签都是一个矩形,像一个盒子,所以HTML页面的布局可以理解为多个盒子组成嵌套排列而成。

2.每个盒模型的基本组成:

宽度(width)、高度(height)、内边距(padding)、边框(border)、外边距(margin)。

3.内边距的注意事项:

Padding 的赋值有4位,从上开始顺时针(上、右、下、左)赋值,并且padding会增加盒模型的面积。

·padding-top

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值