本篇教程学习的是店铺装修-CSS中的盒子模型,喜欢的一起来学习吧。
那我们开始今天的教程吧。
1.CSS中的盒子模型,这个框由几个东西组成,首先是主体内容,它是在中间的位置,并不是从相框的左上角开始的,我们在绘制的时候就绘制中心这一块,旁边的就是填充。
2.内填充在CSS里叫padding,就是内容和外边框产生的距离,再往外就是边框,在CSS里叫border,每一个画作为整体,画框与画框之间有一个小间隔,这个间隔叫外间距,在CSS中叫margin。
3.创建【HTML文件】,在【拆分】视图里面写些内容,盒子模型前面加个h1,再写个盒子模型,加个h2,元素与元素之间有间隔,写个【div标签】。
4.选择【窗口】-【CSS设计器】,点击【+】,选择【在页面中定义】,添加【选择器】,在【布局】里有一个叫margin,黑框代表是一个整体,margin代表的是元素与元素之间的间距,padding也是一样的。
5.写个【style标签】,定义一下宽度,加个背景颜色,刷新一下,文字和外边框靠的特别近,添加padding值,加个【padding-left】【30px】,这个时候字和左边产生一个距离了,加个【padding-top】【60px】,文字就和上面产生了间距,这个就是padding。