本节简介:本节课主要介绍布局中重要的内外间距的设置方法以及注意事项。
本节课同学们做的笔记 点击播放按钮可自动定位到对应时间进行播放
padding(内间距);margin(间距)它们设计简写时的顺序都是:上-右-下-左(顺时针)
有三个值时,第一个值代表上,第二个值代表左右,第三个值代表下
布局中内外间距margin只有一个值时代表上下左右都一样
margin:50px 一个值代表上下左右都相同;两个值时,第一个值上下,第二个值左右;三个值时,第一个值上,第二个值左右,第三个值下;四个值时分别代表上右下左
内间距:,<paddin>就是文本里面和边框的距离.注意加内间距以后,会把整个内容撑大
<margin>是本文之间的调动,左右可以公式用auto,这样就变成居中了
最小宽度:<min>就是设置一个文本的背景宽度的大小,不管有没有内容.背景依然保持住,最小高度也是同样的道理
写代码时,margin:50px 一个值代表上下左右都相同;两个值时,第一个值上下,第二个值左右;三个值时,第一个值上,第二个值左右,第三个值下;四个值时分别代表上右下左
margin是外间距,想要左右居中就左右都选择用auto
设置max-width 可以保证大图片的最大宽度,如果直接设置width,则会将小图拉宽,图像变形。
添加色块时,min-width用px单位可保证设置色块的最小宽度,而100%只显示满当前页面,如果挪动移动条,将会出现空白区域
padding为盒子内间距,值和margin代表一样
margin 盒子的外边距:margin一个值时代表都一样;margin两个值时,第一个值代表上下,第二个值代表左右;margin三个值时,第一个值代表上,第二个值代表左右,第三个值代表下;margin四个值时,分别代表上下左右。