CSS学习笔记(2)

CSS框模型



- element : 元素

- padding : 内边距      不允许使用负值

h1 {padding: 10px 0.25em 2ex 20%;}
     可以按照上、右、下、左的顺序分别设置各边的内边距,各边均可以使用不同的单位或百分比值


- border : 边框。     希望边框出现,就必须声明一个边框样式。

h1 {border-width: 20px;}

忘记声明边框样式是一个常犯的错误。根据以下规则,所有 h1 元素都不会有任何边框,更不用说 20 像素宽了。设置边框样式,比如 solid 或 outset。border-style:
a:link, a:visited {
  border-style: solid;
  border-width: 5px;
  border-color: transparent;     透明边框
  }



- margin : 外边距     
可以是负值,而且在很多情况下都要使用负值的外边距


值复制


h1 {margin: 0.25em 1em 0.5em;} /* 等价于 0.25em 1em 0.5em 1em */
h2 {margin: 0.5em 1em;} /* 等价于 0.5em 1em 0.5em 1em */
p {margin: 1px;} /* 等价于 1px 1px 1px 1px */

外边距合并




假设有一个空元素,它有外边距,但是没有边框、内边距。在这种情况下,上外边距与下外边距就碰到了一起,它们会发生合并



注释:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值